WordPressのテーマ「Diver」を使用してWordPressサイトをカスタマイズします。本稿では、スマホにおけるヘッダー部の左の部分の表示を設定します。Diverでは、ドロワーメニューと読んでいます。
スマホ表示でメニューがどこにもない！
Diverでカスタマイズしたサイトをスマホで見ていると、メニューが表示されていないことに気づくと思います。そこで、ドロワーメニューに表示したいと思います。
ドロワーメニューにメニューを設定する！
ウィジェットの設定画面から、ドロワーメニューにメニューを設定します。「ドロワーメニュー」に「ナビゲーションメニュー」をドラッグ・アンド・ドロップします。「メニューを選択」の設定画面で、PC表示のときに表示しているメニューを指定します。タイトルは、設定しなくて大丈夫です。
スマホのメニューをWordPressの設定で表示する！
Diverの設定ではありませんが、WordPressの設定でスマホの場合だけ表示されるメニューを表示させることができます。「外観」→「メニュー」の画面を開き、「位置を管理」のタブを表示します。「横スクロールメニュー(スマホのみ)」の設定で、表示させたいメニューを選択します。この方法では、ヘッダーの下にメニューが表示されます。
おわりに
Diverでは、デフォルト時にスマホで表示した時にメニューが表示されないために、少し戸惑うかもしれません。ドロワーメニューにメニューを登録しましょう。
関連記事
