Cocoon（コクーン）：ヘッダーメニューの位置を変更する方法

この記事ではCocoon（コクーン）で作成したヘッダーメニューの位置を変更する方法を初心者向けに解説しています。

という方はまずこちらの別記事を参考にしてメニューを作成してみてください。

ヘッダーレイアウト

ヘッダーメニューの位置はCocoon設定の「ヘッダー」タブの「ヘッダーレイアウト」から変更することができます。

というより、「ヘッダーレイアウト」はヘッダーに表示されるサイトタイトルの位置を変更するのがメインでそれに伴ってヘッダーメニューの位置が変更されます。

①：　センターロゴ（デフォルト）

②：　センターロゴ（トップメニュー）

③：　センターロゴ（スリムメニュー）

④：　センターロゴ（スリムトップメニュー）

⑤：　トップメニュー

⑥：　トップメニュー（右寄せ）

⑦：　トップメニュー小

⑧：　トップメニュー小（右寄せ）

①：　センターロゴ（デフォルト）

サイトタイトルとヘッダーメニューがセンターに配置されます。

②：　センターロゴ（トップメニュー）

サイトタイトルがセンターに配置され、ヘッダーメニューは最上部に配置されます。

③：　センターロゴ（スリムメニュー）

サイトタイトルとヘッダーメニューがセンターに配置されます。

デフォルトとの違いがわかりにくいですが、違いはメニューの縦幅が狭くなっています。

④：　センターロゴ（スリムトップメニュー）

サイトタイトルがセンターに配置され、ヘッダーメニューは最上部に配置されます。

②のセンターロゴ（トップメニュー）との違いはメニューの縦幅が狭くなっていることです。

⑤：　トップメニュー

サイトタイトルが左・その右にヘッダーメニューが配置されます。

⑥：　トップメニュー（右寄せ）

わかりにくいですが、⑤のトップメニューと比べてヘッダーメニューが右寄せになっています。

⑦：　トップメニュー小

ヘッダーメニューの縦幅が狭くなっています。

トップメニュー小（右寄せ）

ヘッダーメニューが右寄せ・縦幅が狭くなっています。

※　ヘッダーレイアウトはスキンを設定していると「スキン制御」により設定はできない場合があります。

Cocoon（コクーン）の使い方などに関しては別のまとめ記事をご覧になってください。

Cocoon：設定関係

Cocoonの設定関係に関するまとめ記事です。

Cocoon：使い方

Cocoonの使い他に関するまとめ記事です。

Cocoon：デザインカスタマイズ

Cocoonのカスタマイズに関するまとめ記事です。

ブログの記事を書くのにAIライティングツールを利用すると効率を上げることができます。

現在は多くのAIライティングツールがあります。

そのほとんどが無料お試しでの利用が可能です。

お試し期間が限定のツールもありますが、中には機能制限はありますがずっと無料で利用できるツールもあります。

無料お試しがずっと可能なAIライティングツールをまとめてみたので、是非試してみてください。

\\ 無料お試し利用がずっと可能なAIライティングツール//