スマホメニューにおすすめ!WordPressプラグイン「Responsive Menu」

eyecatch-responsive-menu

どうも、(@nekonotesou)です。

スマホメニューの表示に、WordPressプラグイン「Responsive Menu」を導入してみました。

設定したのは、メニューボタンの表示位置と色を変更しただけです。

スポンサーリンク

プラグインインストール後のスマホメニュー

responsive-menu-01

ヘッダーにハンバーガーメニューが表示されます。

 

responsive-menu-02

クリックすると、横からスッとメニューが表示されます。

「▼」ボタンをタップすると、サブメニューを展開します。

 

ダウンロードとインストール

プラグインの新規追加→「Responsive Menu」で検索。

もしくは、以下のページからダウンロードします。

Responsive Menu

 

メニューボタンを設定する

responsive-menu-03

「Look & Feel」のタブをクリックすると、ボタンの大きさ、表示位置、色などを変更できる項目が表示されます。

「Advanced Setting」タブでは、メニューをどの画面サイズで切り替えるか、ブレークポイントを変更可能です。

 

さいごに

このブログでは、無料テーマのSTINGER5を使用しています。

でも、一つだけ不満だったのが、スマホ表示のメニューがイマイチなこと。それがプラグイン一つで解消できました!今のスマホメニューに不満な方は、ぜひお試しを!

.hljs {
font-family: Menlo, 'Bitstream Vera Sans Mono', 'DejaVu Sans Mono', Monaco, Consolas, monospace;
font-size: 13px;
display: block;
overflow-x: auto;
background: #2d2d2d;
color: #cccccc;
padding: 15px;
border-radius: 5px;
-webkit-text-size-adjust: none;
}

この記事が気に入ったら
いいよ!

Twitter で
スポンサーリンク
iMacと猫が好きな完全インドア派。

コメントを残す