この記事ではWordpressを使ったスマホ用メニューの設定方法について説明します。
いぬくん
スマホやパソコンでネットサーフィンをしていて、たいていのサイトにはメニューボタンやメニューバーがありますよね。
私が使っているテーマはAFFINGER5なのですが、メニューの設定を何もいじっていないとメニューボタンを押しても何も表示されないのです。
ということで、メニューの設定方法とおすすめの表示項目について説明します。
この記事の目次
メニューのカスタマイズ場所
メニューのカスタマイズ場所は次の順で到達できます。
- WordPress管理画面を開く
- ナビゲーションメニューの「外観」を選択
- 「メニュー」を選択
この順でメニューのカスタマイズ画面まで到達することができます。
スマホ用のメニューをつくろう
スマホ用メニューの作成方法
スマホ用のメニューは次の順で作成することができます。
- 「新しいメニューを作成しましょう。」を選択する。
- メニュー名の欄に作成したいメニューを入力する。
- 「メニューを作成」ボタンをクリックしてメニューを作成する。
メニューのカスタマイズ方法
メニューの設定手順について説明します。
- 「外観」→「メニュー」→「メニュー構造」に移動する。
- 「メニュー構造」の「メニュー設定」下の表示したい位置にチェックを入れる。
- 画面左側にある「メニュー項目を追加」から「スマートフォン・・・」を選択する。
- 「メニューに追加」ボタンをクリックし、メニューに追加する。
- 「メニューを保存」ボタンをクリックしてメニューを保存する。
メニューに追加したい項目を追加後も、それぞれの項目に対してプルダウンをクリックして削除や名前の変更や順番の入れ替えによりカスタマイズできます。
カスタマイズ後のメニュー
メニューをカスタマイズ後、スマホでメニューが表示されていることを確認できる。
パソコン用のメニューを作ろう
パソコン用のメニューの作成方法もスマホ用メニューの作成方法と違いはほとんどありません。
パソコン用メニューの作成手順は次の通りです。
- 「外観」→「メニュー」→「メニュー構造」に移動する。
- 「メニュー構造」の「メニュー設定」下の表示したい位置にチェックを入れる。
- 画面左側にある「メニュー項目を追加」から「ヘッダー用メニュー」を選択する。
- 「メニューに追加」ボタンをクリックし、メニューに追加する。
- 「メニューを保存」ボタンをクリックしてメニューを保存する。
先ほどのスマホ用メニューの作成方法との違いは、「メニュー設定」の項目で設定したい場所を変更するだけです。パソコン用のメニューは次のように表示されます。
まとめ
いかがだったでしょうか。
AFFINGER5をとりあえず、購入して吹き出しの設定を初めてやる人向けになるべくわかりやすく記事を書いてみました。
それではまた！