ワードプレスのモバイル時ナビゲーション改善 その2

こんにちは〜 GWも明日で終了ですね。

今日はわざわざ遠くからいらした親戚のおじさんおばさんを熊本が誇る火山 阿蘇山にご案内。阿蘇神社や白川水源にいって自然の安らぎに癒やされてきました。

たまには外でのんびりするのもいいもんです。

さて今回は前回のナビゲーション改善の続きです。

ついに!これなら絶対回遊率アップだ!という方法を見つけたのでその方法をシェアします。



プラグイン Max Mega Menu

使うのは、このプラグイン。

※本来はサブメニューを含む画像付きメニューを作るメガメニュー作成プラグイン

レスポンシブ系メニューはモバイルの横幅になるとトグルメニューになってしまいます。これをモバイルの横幅でもPCと同じようにナビゲーションを表示したままにすればナビゲーションのクリック率も増えるはず。

そう考えました。

このMax Mega Menuは、モバイルの幅を低く設定することでスマホやタブレットの幅でもトグルメニューにならずにナビゲーションを表示することが可能です。

ナビゲーション改善方法

Responsive Breakpointの設定

Mega Menu管理画面を開いて、Menu ThemesーMobile Menuを選択。その中のResponsive Breakpointを100px(デフォルト値は600px)など小さい値を入れてあげるとスマホ画面でもナビゲーションが表示されたままになる。

メニューの設定

外観ーメニューを開くと左側にMax Mega Menu Settingsというパーツが増えています。このパーツの一番上のEnable(有効)にチェック。

改善方法はたったこれだけですw

ちなみに上画像のメニュー右側の各メニューにカーソルを合わせたらメガメニューの個別設定が可能です。(モバイル非表示・アイコン設定が便利)

改善結果

トグルメニューは残したまま、モバイル表示でナビゲーションを残すことができました。トグルメニューを押すとナビゲーション表示・非表示を切り替えることが可能です。

ただし今回の設定をする場合、メニューの数、文字数が多い場合は2段3段と増えてしまうのでメニューの数と文字数は少なめに設定することが必要です。フォントサイズはメガメニューの設定画面の中で変更可能です。

アフィリエイトの場合ほとんどがモバイル表示だと思うので、ヘッダーメニューをモバイル優先で考えてしまっていいと思います。このブログの場合はPCも多いので向いていませんが。

今回の手法以外にいい方法を僕にアドバイスいただける方がいたら是非コメントください! 色んなアイデアをお待ちしております。

がんちゃんのおすすめアフィリエイト塾

アフィリエイトを1年やってきて感じることは、先生や師匠がいる環境が大事ってこと。
アフィリエイトのノウハウも大事だけど、心の支えになってくれる友人たち、先生、師匠の存在はとても大切です。

僕の場合、友人にアフィリエイト塾AMCを紹介してもらい今は無料会員として、たまに各地セミナーに遊びにいって交流しています。

トレーニングジムと同じでジムに1人で行く人は意外と続かない。しかし仲間と行くと継続率が高くなります。アフィリエイトも仲間が増えるとアフィリエイトを辞めてしまうことはほぼなくなるでしょう。

続ければ必ず成果が出るアフィリ。僕のおすすめアフィリエイト塾は、AMCです。
もしAMCに申し込みされた方がいらっしゃったら、AMCのSNSで「がんちゃん」で日記書いていますのでご一報ください。
色んなご相談にお答えいたします。

→ アフィリエイト塾AMC申込み

シェアしてくれるとチョーうれしいです!

フォローする