WordPress

ヘッダーにメニューを加える方法

投稿日:2017年1月9日 更新日:

WordPressではヘッダーに横長のメニューを割と簡単に加えることが出来ます。ちょっと機械的な作業っぽいですが、6つのステップを試してみてください。

*テーマによって、ヘッダーのデザインは多少異なります。

  1. 「外観」ー「メニュー」を選択します。
  2. 「新規メニューを作成」をクリックします。
  3. 「メニュー名」にお好きなメニュー名を英数で付けます。
  4. 「固定ページ」から「すべてを選択」します。
  5. 「メニュー構造」にすべての作成済みのカテゴリーがリストされます。
  6. 「メニュー設定」の「メニューの位置」の「ヘッダー用メニュー」にチェックマークを入れます。

一旦、『メニューを保存』ボタンをクリックして、実際のサイトでヘッダーに加えられたメニューを見てみましょう。

各項目をクリックするとカテゴリーにリンクされているのが確認できますね。
もし、リンクはそのままで、メニューに表示する項目名だけを変更したい場合は「メニュー構造」にある該当カテゴリーをクリックし、「ナビゲーションラベル」の名前を変更します。

メニューに表示したくない項目があれば、同じく「メニュー構造」の該当カテゴリーをクリックして、「削除」します。*カテゴリーは消えませんが、メニューに表示されません。

表示する項目の順番を変更するには「メニュー構造」の各項目をドラッグして入れ替えることが出来ます。

カテゴリー以外の項目をメニューに表示したい場合は、「カスタムリンク」で表示したい項目名とURLとを入れます。「ホーム」、「contact」などカテゴリーにはないもので、メニューに使いたい項目はありますよね。

*フッターにメニューを加えたい場合にも同じステップで、6.の「メニューの位置」で「フッター用メニュー」にチェックマークを入れます。テーマにより異なりますが、通常フッターメニューは小さく表示されます。

スポンサーリンク

-WordPress

関連記事

blog

Stinger8 トップページだけ1カラムにする

Stinger8でトップページだけをデザイン上、サイドバーが非表示の1カラムにする場合の方法です。サイト全体のサイドバー非表示の方法はこちらです。 新規テンプレートを作成してトップページ及び特定の固定 …

blog

スマホのスライド式メニュー

使っているテーマのスマホのヘッドメニューは、ドロップダウンメニューなので本文が隠れるのですね。ちなみにStinger8です。 そこで、簡単にスマホのヘッドメニューをスライド式に変更しました。 実際のと …

blog

サイトをWordPressで作り替える

Htmlで作った古いサイトありますね。 もう10年とか。作り替えるとなる考える点は2つ。 WordPressの新サイトが完成するまで既存のサイトは停止したくない! 作成途中のWordPressの新サイ …

blog

CSS margin & padding の省略形

CSSのマージンとパディング marginとpaddingは-top, -bottom, -right, -leftと合わせて使いますが、省略形もありますね。 padding-top: 10px; p …

blog

投稿ページごとに違うサイドバーを表示

投稿ページごとや固定ページごとに違うサイドバーを表示 カテゴリーが沢山あって、一括でメニューを作成したら複雑になったので、カテゴリーAを選択したら、A関連だけのナビゲーションメニューをサイドバーに、カ …

Author Profile
こつこつインフォの筆者こつ子です。
いつも兀々やってます。
出版関係のグラフィックデザイナー。
趣味はWebsiteを作ること、ヨガ、犬と山歩き、フルーツ酒作り。
読んでくれてありがとう〜!
**ご意見はこちらへ**