YouTubeもやってるよ
PR

cocoonのヘッダーメニュー作成でドロップダウン表示させる方法

コクーンメニュー設定 ドロップダウン表示 ブログ・web

ヘッダーメニューでドロップダウン表示させる方法

WordPressのcocoonでヘッダーメニューをドロップダウン(カーソルをあてるとサブカテゴリーがでるやつ)を設定したい方は簡単なので参考にしてください。

nemu
nemu

簡単に言えば追加したメニューをドラッグ&ドロップで右に移動させるだけ

スポンサーリンク

外観メニューで新しいメニューを作成

cocoon設定の下の『外観』より→『メニュー』を選択します。

『新しいメニューを作成しましょう。』からメニュー構造の『メニュー名』に自分がわかりやすいようにヘッダーメニューなど書いてメニューを作成ボタンを押します。

ヘッダーメニュー追加方法
メニューを作成すると左側にメニュー項目を追加で

固定ページ、投稿、カスタムリンク、カテゴリーでどのページ、メニューを追加するのかを選ぶことができます。

スポンサーリンク

カテゴリーページをメニューに追加

『メニュー項目を追加』より『カテゴリー』を選択します。

自分が作成したカテゴリーが表示されるので表示させたいカテゴリを選択し、メニューに追加を選択します。

メニューに追加

右側に追加したメニューが表示されます。
例として通信、ツールのカテゴリを右側に追加しました。位置はドラッグで変更できます。

スポンサーリンク

ドラッグ&ドロップで移動させる

ドロップダウンさせたいカテゴリーにカーソルをあてを少し右にドラッグ&ドロップで移動させます。右下に移動できていれば大丈夫です。

これでカテゴリーのメニューをヘッダーにドロップダウン表示させることができます。めちゃくちゃ簡単です。

この状態でメニューを保存するだけでは表示されません。
なのでそのしたのメニュー設定でメニューの位置をチェックします。

『ヘッダーメニュー』にチェックを入れてメニュー保存します。

ヘッダーメニューにチェックして保存を忘れずに。

カスタムリンクにしたい場合

カテゴリーページではなく、カスタムでリンクをメニューにしたい場合はURLと表示させたいリンク文字を入力してメニューに追加することでヘッダーのメニューに追加することもできます。

カスタムリンクにしたい場合

確認するとこのようになります。

カスタムリンクにした場合

テーマや表示設定などによって位置がかわります。

他にもお問い合わせなど、固定のページをヘッダーに追加したい場合にも同じようにメニュー項目から選び追加することで簡単にヘッダーメニューに追加することができるのでやってみてください。

ブログ・web
スポンサーリンク
nemuフォローする
記事を書いてるやつ
nemu

nemuです。
眠たい目をこじ開けていいモノ探し。いいモノとは値段ではなく自分の心がときめくものだ。最近ミーノに心を奪われた。。( ˘ω˘)スヤァ。。
YouTubeもやってます。

nemuフォローする
タイトルとURLをコピーしました