【限定特典】ATLASのスマホ用フッターメニューの設定方法

ATLASの限定子テーマを使えば「スマホ用フッターメニュー」も簡単に作ることができます。以下のようなメニューが簡単に作れるということですね。

これにより離脱率が抑えられるほか、意図したページへの流入数も増えますので、SEO対策や収益化にも繋げることができます。

そんな便利なスマホ用フッターメニューですが、この機能を使用するには簡単な設定方法が必要になります。その方法について当記事では説明をさせていただきましょう。

カスタマイズ①:メニューを有効にする

子テーマ導入時からスマホメニューは表示されていますが、これはまだハリボテ状態です。まずは、このメニューに記事リンクを当てはめる作業をしていきましょう!

WordPressの管理画面を開いて、「外観」>「テーマの編集」と進んでください。

テーマフッターを開く

そうすると「テーマフッター」というファイルが見つかりますので、これをクリックして開きましょう。

フッターメニューのコードを見つける

テーマフッターを開くとphpがずらりと並んでいますが、、、これを下に少しスクロールすると「ここからフッターメニュー」という文字が見つかると思います。ここを今から編集していきましょう。

ちなみにこのコードは、以下のようにスマホメニューと対応しています。緑がホーム・青がコンテンツ・黄色がランキング・赤が口コミの部分ですね。それを知った上で編集をしていきましょう。

リンクを挿入する

ではフッターメニューに記事のリンクを当てはめていきましょう。

a href=”#”となっている部分がわかりますでしょうか?

この#の部分に、記事のリンクを当てはめます。
(【変更例】# → https://hituji-demo.com/atlas/)

  • 緑の#:ホーム用のリンク
  • 青の#:コンテンツ用のリンク
  • 黄の#:ランキング用のリンク
  • 赤の#:口コミ用のリンク

上の写真のようにリンクを当てはめると、ボタンが機能するようになります。飛ばしたいページのリンクを取得してきて、#部分に当てはめるようにしましょう!

これだけでもアトラスのフッターメニューは使えるようになりますが、メニューのフレーズやアイコンを変更したい場合にはもう少しカスタマイズが必要となります。

カスタマイズ②:メニューの項目名を変更する


さて、次はメニュー項目名を変更する方法についてお伝えをいたしましょう。

もしメニューの項目名を変更したい場合には、以下の赤枠で囲った部分の文字を変更するようにしてください。

この「ホーム」「コンテンツ」「ランキング」「口コミ」の文字を変えるだけで、メニュー名を変えることができます。

ちなみに当サイトの場合には以下のように変更しています。ご参考程度に。

  • ホーム→変更なし
  • コンテンツ→アトラスの機能
  • ランキング→限定特典
  • 口コミ→ダウンロード

カスタマイズ③:メニューアイコンを変更する

では最後に、メニューアイコンを変更する方法についてお伝えしましょう。

ここはどうやって変更するのかと言えば、fontawesome(フォントオーサム)というサービスがあるので、そこからアイコン用のコードを拾ってきて変更をするのです。

fontawesomeを開く

ffontawesome(フォントオーサム)を開くと様々なアイコンが並んでいるのがわかると思いますが、この中から好きなものを選択してクリックしてください。

アイコンコードをコピーする

アイコンをクリックすると以下のような画面が開くと思います。

すると画像の赤枠部分のように、アイコン用のコードが表示されますので、これをコピーしてください。

アイコンコードをペースト

さて、phpに戻ります。

そうすると以下のような文字列があるのが確認できますでしょうか?これがアイコンを表示されているコードですね。(もし読みづらい場合にはクリックして拡大表示をお願いします。)

この変更したい部分に、先ほどコピーしたアイコンコードを貼り付けましょう!

例えば当サイトの場合ですと、「口コミ」の部分だけ「ダウンロード」のアイコンに変更したかったので、以下のようにコードを置き換えています。

このようにしてアイコン変更は可能です!

まとめ

以上でスマホメニューの設定が完了です!うまく設定できましたでしょうか?

できる限り画像を使わせてもらいましたが、もし説明不十分な点がありましたらお問い合わせくださいませ。

関連記事

【ヘルプ】フッターメニューが見当たらなくなった時の対処法

【限定特典】ATLASのフッターカスタマイズ

【限定特典】Table of Contents Plusの特別カスタマイズ

【ヘルプ】スマホフッターメニューを削除したい場合