背景

Wordpressでレスポンシブル（画面のサイズによって表示を変更する）サイトを作っている際、問題になるのがスマホの画面でのメニュー表示です。 テーマによってはメニューが表示されるものもありますが、中には画面の一番下までスクロールしないと過去の記事を読めないものがあります。

そんなときに、ShiftNavというプラグインを見つけました。 こちらは、インストールするだけでタイトルバーと左上におなじみのハンバーガーメニュー（最近、ユーザフレンドリーでないと話題になっていますが…）が表示されます。

上が導入前、下が導入後

メニューを開く

カスタマイズ

さて、このプラグインの良いところはカスタマイズができるところです。 ダッシュボード > 外観 > ShiftNav から設定を変更することができます。 僕の場合は、タイトルバーは不要と思ったので、 Toggle Bar タブの「Hamburger button only」にチェックを入れ、「Toggle Breakpoint（画面の横幅が何pxを下回ったら ShiftNavを表示するか）」 を710px に設定しました。