【SnowMonkeyカスタマイズ】スマホのフッター固定ナビでアイコンを設置する方法 -アイコンタップで電話をかける場合-

こんにちは!
じゃんきーです!

今回はスマホでのレイアウトでよく見かける
スマホでのフッター固定ナビにアイコンを設置する方法をお伝えします。

今回行うカスタマイズは以下の感じです↓

スマホアプリやスマホでサイトを閲覧しているときに
フッターにアイコン付きのナビがあるとタップして次の操作に移りやすいですよね。

それがSnowMonkeyで制作すると簡単なカスタマイズで実装できます。

それではさっそく始めていきましょう!

フッター固定ナビメニューの作成

①WordPress管理画面へ入る

②左側メニューから「外観」→「カスタマイズ」クリック

③カスタマイズ画面の左側にある「メニュー」クリック

④「メニューを新規作成」をクリック

⑤メニュー名を入力。(これはなんでも大丈夫です。)
今回は「スマホ固定ナビ」にしてます。

⑥「フッター固定ナビゲーション」にチェックを入れる

メニュー項目の作成

①「項目を追加」をクリック

②「カスタムリンク」をクリック

③URLに「tel:電話番号」を入力

④リンク文字列に下記コードを入力

<i class="fas fa-mobile-alt fa-2x"></i>TEL

※アイコンにはFontAwesomeを使用しています。

⑤「メニューに追加」をクリック

以上です。

まとめ

フッターメニューを増やしたい場合は同じ手順を繰り返すと実装できます。
この手順通りに行えば、スマホで閲覧した際に操作性がアップするサイトを
制作することができると思います。
ぜひ一度お試しあれ〜!

もし何かご意見・ご感想があれば
TwitterのDMからお願いいたします。

ありがとうございました〜

じゃんきー

この記事を書いた人

じゃんきー

こんにちは!じゃんきーブログを運営しているじゃんきーです。
1987年生まれ。
妻、子ども2人、ねこ1匹と暮らす30代の男。
大学卒業後、作業療法士として病院に10年以上勤務。
家族とのハワイ旅行などより豊かな生活を夢見て、副業に挑戦。
現在WordPressでのWEB制作、ShopifyでのECサイト制作を中心にフリーで活動中。
TwitterのDMなどお気軽にお問い合わせください。