気づき&学び days

はまぞうブログをスマホで見ると、パソコン用のヘッダー部分やサイドバーの内容は基本的に表示されません。

お店や教室を持っている方が、

「メニュー」「電話番号」「メールを送る」「アクセス」などのお店情報をパソコン版のヘッダーやサイドバーに載せている場合、

スマホでのネット閲覧率が70%近いと言われている中、その人たちにお店情報を案内することができなくなってしまいます。

そんな時、

たった１行の「シンプルナビ」（私が勝手につけた名前です）

のコードをカスタムプラグインに書くだけ

で、各記事の上部にお店情報を載せることができます。

たった１行なので、記事の上部にあっても記事の閲覧を妨げることもないと思います。

はまぞうブログはスマホ専用のカスタムプラグインも３つ用意されているので、スマホで閲覧される場合だけ表示できます。


今日は、そんな「シンプルナビ」のつくり方を紹介します。

「シンプルナビ」とは次のようなイメージです。

（この表示ではまだリンクをかけていない状態です）

これをスマホで記事の上部に表示させるために、

ブログ管理画面→ブログ環境設定→カスタムプラグインの登録→スマートフォン



へと進み

カスタムプラグイン１～３のいずれかに、次のHTMLタグを貼り付けます。

そして、

・メニューのリンク先URL

・tel:0123456789 ←赤字のところに電話番号を入れます

・mailto:abc@xxx.yyy ←赤字のところにメールアドレスを入れます

・アクセスのリンク先URL

それぞれのリンク先を記述します。

次に、そのカスタムプラグインの表示場所に「記事一覧の上部」を選択し、画面下にある「更新」ボタンを押して設定は完了です。

リンク先を記述したあとの表示は次のようになります。

（メニューとアクセスにはリンクをかけていない状態での表示です）

設定が終わったら必ず、思った通りにスマホに表示されるか確認してください。

これで、スマホユーザーがあなたのお店のブログを見た時、記事の上部に「シンプルメニュー」が表示され、

シンプルメニューをタップするだけで、お店にコンタクトを取ることができるようになります。

今日も最後までお読みくださりありがとうございました。