今回は、ヘッダーロゴのカスタマイズについてまとめています。
初心者でも簡単にCocoonをカスタマイズすることができるマニュアルは ⇒ こちら ⇐
ヘッダーロゴの設定方法
Cocoonの場合は、デフォルトのヘッターロゴはシンプルなものになっています。
ヘッダー設定
１．WordPressメニューを選択し、「Cocoon設定」を選択します。
２．「Cocoon設定」から「ヘッダー」タブを選択して、上から順に設定を進めていきます。
３．設定内容は、以下のようにしています。
・ヘッダーレイアウト
→センターロゴ（デフォルト）
・ヘッダーの固定
→チェックしない
・高さ
→なし
・高さ（モバイル）
→なし
・ヘッダーロゴ
→「選択」から表示する画像をアップロードします。
・ヘッダーロゴサイズ
→横幅のみ入力します。（ページを確認しながら調整する）
・キャッチフレーズの配置
→表示しない
・ヘッダー背景画像
→なし
・ヘッダー全体色
→緑色を選択しています。
・ヘッダー色（ロゴ部）
→ロゴエリア背景色：好きな色を選択します。
→ロゴ文字色：デフォルトのまま
上記のように設定が完了したら「変更をまとめて保存」でヘッダーの設定は完了です。
モバイル設定
続いて「Cocoon設定」の「モバイル」タブを選択します。
設定内容は以下の通りになります。
・モバイルメニュー
→フッターモバイルボタン
・モバイルボタン
→サイトヘッダーロゴを表示する
→モバイルボタン時コンテンツ下のサイドバーを表示
以上を保存して、モバイル設定は完了です。
デザインの確認
PC版とスマホ版どちらも正しくヘッダーロゴが表示されていることが確認できれば、OKです。自分好みのサイト作りに取り組んでいきましょう。
他のカスタマイズについては、初心者でも簡単にCocoonをカスタマイズすることができるマニュアルを参考にしてみてください ⇒ こちら ⇐
コメント