Search Posts

ドロワーナビゲーションメニュー表示機能

ドロワーナビゲーションメニュー表示機能の概要

Webサイトの共通ヘッダー部、右端のハンバーガーボタンで、[管理サイト] – [外観] – [メニュー]で作成したカスタムメニュー(最大2階層まで)を、右側からスライド表示することができます。

jQueryライブラリのDrawerを利用させていただきました。

デバイスサイズに応じて、ヘッダーメニューやグローバルナビゲーションと表示を切り替えることで、スマホサイズ専用のレスポンシブ対応メニューとしてもご利用可能です。
初期設定では、どのサイズでも表示されるようになっていますが、特定のデバイスで表示が不要であれば、CSSのMedia Queries(メディアクエリ)で調整し、非表示にしてください。

カスタムメニューが未定義・空欄であれば、非表示となります。

テンプレートファイルのカスタマイズ

ドロワーナビゲーションメニュー表示機能をカスタマイズするには、テンプレートファイル header.php から、get_template_part()している、template-parts/header-navigation.php を編集してください。