WordPress

【WordPress】レスポンシブモバイルメニュープラグインWP Mobile Menu

April 1, 2017


WP Mobile MenuはWordPressのメニューを使ってレスポンシブモバイルメニュー実装できるプラグイン。左右どちらでもメニュー設置可能、レスポンシブ対応、ロゴ設置、背景設定、モバイルメニューを表示するブラウザ幅設定、Googleフォントなど設定項目も充実しています。

WP Mobile Menuプラグインを導入

ダッシュボード >> プラグイン >> 新規追加 >> WP Mobile Menuを検索
有効化にするとMobile Menu Optionsが追加されます。


登録しなければSkipをクリックします。

Mobile Menu Options


General Options

Enable Mobile Menu モバイルメニューを有効
Enable Left Header Menu 左ヘッダーメニューを有効
Enable Right Header Menu 右ヘッダーメニューを有効
Width Trigger モバイルメニューを表示する幅
Hide Elements 要素を非表示
Custom CSS カスタムCSS


Header options

Site Logo サイトロゴ
Logo ロゴ
Naked Header 背景を無背景色
Alternative Logo URL 代替ロゴURL
Disable Logo URL ロゴのURLを無効
Header Height ヘッダーの高さ
Logo Top Margin ロゴ上マージン
Header Text ヘッダーテキスト
Header Menu Font ヘッダーメニューフォント


Left Menu options

Left Menu 左メニュー
Left Menu Font 左メニューフォント
Left Menu Background Image 左メニュー背景画像
Left Menu Background Image Opacity 左メニュー背景画像の不透明度
Menu Icon メニューアイコン
Menu Icon Image メニューアイコンイメージ
Left Menu Width Units 左メニューの幅ユニット
Right Menu Panel Width(Pixels) 右のメニューパネルの幅(ピクセル)
Right Menu Panel Width(Percentage) 右のメニューパネルの幅(パーセント)
Icon Top Margin アイコン上マージン
Icon Left Margin アイコン左のマージン


Right Menu options

Right Menu 右メニュー
Menu Icon メニューアイコン
Menu Icon Image メニューアイコンイメージ
Right Menu Font 右メニューフォント
Right Menu Background Image 右メニュー背景画像
Right Menu Background Image Opacity 右メニュー背景画像の不透明度
Right Menu Width Units 右メニューの幅ユニット
Right Menu Panel Width(Pixels) 右のメニューパネルの幅(ピクセル)
Right Menu Panel Width(Percentage) 右のメニューパネルの幅(パーセント)
Icon Top Margin アイコン上マージン
Icon Right Margin アイコン右のマージン


Color Options

Header Background Color ヘッダーの背景色
Header Text Color ヘッダーテキストの色

Left Menu Colors

Left Menu Icon Color 左メニューアイコンの色
Background Color パネルの背景色
Text Color テキストの色
Background Hover Color 背景ホバー色
Hover Text Color ホバーテキストの色
Submenu Background Color サブメニューの背景色
Submenu Text Color サブメニューのテキストの色

Right Menu Colors

Right Menu Icon Color 右メニューアイコンの色
Background Color パネルの背景色
Text Color テキストの色
Background Hover Color 背景ホバー色
Hover Text Color ホバーテキストの色
Submenu Background Color サブメニューの背景色
Submenu Text Color サブメニューのテキストの色