『Cocoon』のヘッダー画像とロゴ、キャッチフレーズの設定方法

こんにちは、久川和人です。

WordPressテーマ『Cocoon（コクーン）』では、トップページのヘッダー部分にヘッダー画像（背景画像）とロゴ、キャッチフレーズを設定することができます。

今回は、『Cocoon』のヘッダー画像とロゴ、キャッチフレーズの設定方法について説明していきます。

Cocconがインストールされていない場合は、こちらの記事にインストール方法が書かれていますので、参考に設定してみてくださいね。
↓
【図解で簡単！】WordPressテーマ『Cocoon』のインストール方法

ヘッダー画像の設定方法

ヘッダー画像の設定を行うには、WordPress管理画面の左メニューから、【Cocoon設定】→【Cocoon設定】をクリックします。

Cocoon設定画面が表示されるので、【ヘッダー】タブをクリックします。

ヘッダー設定画面が表示されます。画面を下にスクロールし、「ヘッダー背景画像」の項目の【選択】をクリックします。

画像を選択する画面が表示されます。メディアライブラリの中から選択する場合は、ヘッダー画像にしたい画像をクリックし、右下の【画像の選択】をクリックします。

ヘッダー画像にしたい画像を新規にアップロードしたい場合は、「ファイルをアップロード」タブをクリックし、アップロードするファイルをドロップ、または、【ファイルを選択】をクリックして、画像を選択します。

右下の【画像の選択】をクリックします。

選択したヘッダー画像が表示されます。

ヘッダー画像の設定が終わったら、画面上部または画面下部にある【変更をまとめて保存】をクリックします。

これでヘッダー画像が設定されました。ブログを表示させると、ヘッダー部分に画像が表示されていることが確認できます。

ヘッダー画像の高さの設定方法

ヘッダー画像の高さは自動的に設定されますが、好きな高さも設定することができます。その場合は、「高さ」の項目の右側にサイズを入力します。個別にモバイル用に設定したい場合は、「高さ（モバイル）」の項目の右側にサイズを入力します。

設定が終わったら、画面上部または画面下部にある【変更をまとめて保存】をクリックします。

ロゴ/キャッチフレーズの文字の設定方法

ロゴとキャッチフレーズの設定を行うには、WordPress管理画面の左メニューから、【設定】→【一般】をクリックします。

「サイトのタイトル」、「キャッチフレーズ」を入力します。「サイトのタイトル」がロゴの文字となります。

入力が終わったら、画面を下にスクロールして、【変更を保存】をクリックします。

ロゴ/キャッチフレーズの文字色の設定方法

ロゴとキャッチフレーズの文字色を変更するには、WordPress管理画面の左メニューから、【Cocoon設定】→【Cocoon設定】をクリックします。

Cocoon設定画面が表示されるので、【ヘッダー】タブをクリックします。

ヘッダー設定画面が表示されます。画面を下にスクロールし、「ヘッダー色（ロゴ部）」の項目のロゴ文字色の【色を選択】をクリックします。

好きな色をクリックするか、色コードを入力します。

設定が終わったら、画面上部または画面下部にある【変更をまとめて保存】をクリックします。

キャッチフレーズの配置の設定方法

キャッチフレーズの配置は、デフォルトではロゴ文字の上に表示されます。

上図のように、ロゴがセンター（中央）に表示している場合は、キャッチフレーズをロゴ文字の下に表示させることもできます。変更するには、WordPress管理画面の左メニューから、【Cocoon設定】→【Cocoon設定】をクリックします。

Cocoon設定画面が表示されるので、【ヘッダー】タブをクリックします。

ヘッダー設定画面が表示されます。画面を下にスクロールし、「キャッチフレーズの配置」の【ヘッダーボトム】欄をクリックします。

設定が終わったら、画面上部または画面下部にある【変更をまとめて保存】をクリックします。

おわりに

今回は、『Cocoon』のヘッダー画像とロゴ、キャッチフレーズの設定方法について説明いたしました。

Cocoonではヘッダー画像とロゴ、キャッチフレーズの設定が簡単にできますので、お好みに合わせて設定を変更してみてくださいね。