【Cocoon】ヘッダーロゴの設定方法

こんにちは、ikuzo(いくぞう)です。

今回はWordPressのテーマ「Cocoon」でのヘッダーロゴの設定方法を紹介します。

ちなみにブログのロゴの作り方は、こちらの記事を参考にして下さい。

ヘッダーロゴがないとタイトルがそのまま表示される

Cocoonで「ヘッダーロゴ」を設定していないと、サイトのタイトルがそのまま表示されます。

サイトのタイトルとは、WordPressの「一般設定」で入力したものです。

ヘッダーロゴを設定すると、たとえばこんな感じになります。

それでは、Cocoonのヘッダーロゴの設定方法を説明します。

「Cocoon設定」をクリックします。

次に「ヘッダー」タブを押します。

以下、「ヘッダー設定」の内容をひとつずつ説明します。

ヘッダーレイアウト

ここは、ロゴの位置とメニューの位置と太さを選びます。

Cocoonのヘッダーレイアウトは全部で8種類あります。

レイアウトの中から1つ選んで「変更をまとめて保存」を押すと、どんなレイアウトなのかプレビューで確認ができます。

一通り試して、気に入ったものを選びましょう。

なお、Cocoonのトップメニューは作らないとありません。

グローバルナビメニューの作り方↓

ヘッダーの固定

ヘッダーを追従させるか（画面に出たままにするか）どうかです。

こちらはPCのみの設定です。モバイルの設定はこちらの記事をご覧ください。

高さ

必要があればヘッダーの高さを指定します。

ヘッダーロゴ

ここでロゴを設定します。

ヘッダーロゴの「選択」を押して、

ロゴをドロップ、

代替テキストに「ブログのロゴ」などと入力して「画像の選択」を押します。

これでヘッダーにロゴが表示されているはずです。

ヘッダーロゴサイズ

表示させるロゴの大きさを、ここで指定します。

「幅」か「高さ」のどちらかを決めれば、もう片方は比率を保持して表示されます。

ヘッダー背景画像

ヘッダーの背景に写真などの画像を使う場合は、ここで設定します。

ヘッダー全体色など

ヘッダーやグローバルナビメニューの色を指定します。

何も指定しなければ背景は「キーカラー」が表示されるようです。

今回は、Cocoonのヘッダーロゴの設定方法を紹介しました。

「これからロゴを作る」という方は、こちらの記事を参考にして下さい。

本日は最後まで読んでいただき、ありがとうございました(^_^)