ワードプレスで自作テーマ作成-L2 ナビゲーションメニューを表示させる-

2019年9月1日

ワードプレス

ワードプレスで自作テーマ作成シリーズ
今回は「Lesson 2 ナビゲーションメニューを表示させる」方法をご紹介します。

ナビゲーションメニューとは、各ページへ遷移するためのメニューです。

初期段階ではワードプレスの管理画面にも、ホームページにもナビゲーションメニューが表示されておりませんのでそれを表示させましょう!

コピペだけなので初心者でも簡単にできますよ!

メニューの有効化手順

初期段階では、ワードプレスの管理画面の「外観」に「メニュー」がありません。

ワードプレスメニューの有効化

それを以下のようにワードプレスの管理画面の「メニュー」を有効化し表示させます。

ワードプレスメニューの有効化

①functions.phpに記述

Theme Editor」でfunctions.phpに以下の記述を記入し更新します。

「Theme Editor」でのファイルの追記方法は以下の記事を参考にしてください。

ワードプレスプラグインTheme Editorの基本的な使い方

②アップロード

ワードプレスの管理画面を再読み込みすると外観にメニューが追加されています。

ワードプレスメニューの有効化

ページにもメニューを表示させる

①メニューを作成

まずはメニューを作成します。

ワードプレス管理画面の「固定ページ」で「会社案内」や「お問合せ」などのページを作ってください。

そしてさきほど表示させた「外観」→「メニュー」から表示させたいメニューを追加していってください。

メニューを表示させる手順

今回は例として「ホーム」、「商品案内」、「会社案内」、「アクセス」、「ニュース」、「お問合せ」のメニューを作成しました。

②header.phpに記述

Theme Editor」で以下のコードをheader.phpの<body>の下に記述し更新してください。

③ナビゲーションメニューが表示されます

以下のようにメニューが表示されていると思います。

メニューを表示させる手順

次回はメインビジュアルを表示させます。

ワードプレスで自作テーマ作成-L3 メインビジュアルを表示させる-ワードプレスで自作テーマ作成-

\記事が役に立ったらシェアしてね/
★フォローする★

コメント

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です