Cocoonでヘッダー画像を設定する方法「簡単・ワンクリックでOK」

こんにちは、Mioです!

今回は、優秀なワードプレス無料テーマであるコクーンでヘッダー画像を設定する方法についてご紹介します(‘ω’)ノ

コクーンは無料テーマであるにもかかわらず、かなり充実した機能が装備されていてカスタマイズもとっても楽‼

実際に使ってみて快適に使えてるのですが唯一ヘッダーの設定方法がわかりづらかったです。

まだ使い始めてから日が浅いというのもあるのかもしれませんが…(;´・ω・)💦

でも、操作自体はとっても簡単なのでワンクリックで出来ちゃいます

コクーンでヘッダーを設定する

管理画面にログインしたら、卵型のアイコンと共にCocoon設定というところがあると思うんですがその一番上にCocoon設定があるのでクリックします。

そうすると、こんな感じで上の方に沢山のタブが出てきます👇

デフォルトでは、全体のタブが選択されていると思うのでヘッダーのタブをクリックしましょう。そうすると、画面がヘッダー設定に切り替わります💡

特に推奨サイズとかもなく、綺麗にタイトルロゴが表示されるはずです(*‘ω‘ *)

ヘッダーロゴというところで、選択をクリックすると保存している画像を選択することが出来るので既に作成したタイトルロゴなどを選択するとアップロードされます。

すぐ下に、小さくプレビューが表示されるはずなので確認しましょう👇

良ければ、最後に変更をまとめて保存ボタンをクリックして完了です。

これで簡単にヘッダー画像が設定できたと思います(‘ω’)ノお疲れさまでした✨

ヘッダー画像背景や外観からは操作しないので要注意

コクーン設定の中のヘッダーを選択すると、ヘッダーロゴの下の方にヘッダー背景画像というものもありますがこちらはヘッダーの背景なのでタイトルを設定するところじゃありません。

わからずに最初に設定しようとしたら、かなりタイトルが大きくなってしまいました💦

また、通常ヘッダーの設定と言えば外観にあるヘッダーからヘッダー画像を設定していくことが多いと思います。

リファインもそうですし、シンプリシティ、twenty seventeenもそうですからね(‘ω’)

でもコクーンでは外観のヘッダーはヘッダー背景画像を設定することが出来てもタイトルロゴを設定するところではないので、タイトルロゴを設定する場合は必ずコクーン設定のヘッダーロゴから設定するようにしましょう。

以上、参考になれば幸いです(´ω`)✨

バイマ個別コンサルはこちら

BUYMA バイマ コンサルティング

シェアする

  • このエントリーをはてなブックマークに追加

フォローする

コメント

  1. おもち より:

    コメント失礼いたします!
    「Cocoonでヘッダー画像を設定する方法」という記事についてお伺いしたいのですが、ヘッダーを設定する画面の上部に「プレビュー」が表示されると思うのですが、こちらは「まとめて保存」を押さないと反映されないのでしょうか?
    「まとめて保存」を押すと、実際のサイトが更新されてしまい、困っています。
    プレビューで確認してから問題なければ実際のサイトに反映させるという方法はないのでしょうか?

    • Mio より:

      おもちさん、こんにちは。
      コメントありがとうございます。

      プレビューで確認しながらヘッダーを設定する場合は、Cocoon設定からではなく外観から設定してみてください。
      ワードプレスのダッシュボード画面で「外観」→「背景」をクリックするとプレビューで確認しながらヘッダーの設定ができるかと思います。