アメブロ情報

【簡単!】ブログの電話番号やメールアドレスにリンクを貼って、スマホからタップして連絡できるようにしよう!

スマホでブログを見ている時に・・・

気になるお店があった!

今から行きたいけど空いてるかな?

よし、電話して問い合わせてみよう!!

・・・・・でも電話番号がベタ打ちされているだけだと、

  1. 番号をコピーして
  2. 通話アプリ立ち上げて
  3. 番号をペーストして発信

って、めちゃくちゃめんどくさくないですか??

ブラックのりんちゅ
ブラックのりんちゅ
私、「問い合わせしてから行こう・・」と思ったお店の電話番号、ベタ打ちされてるだけだったら、めんどくさくて行く気なくすんだわ

・・なんですが、電話番号やメールアドレスのリンクの貼り方を知っていれば
スマホで電話番号をタップしするだけで電話を掛けたりメールを送ったりできます。

しかも、やり方もめちゃ簡単!!

HTMLの知識も必要ありません!!

という事で、アメブロで電話番号やメールアドレスにリンクを貼る方法をお伝えします。

直接発信できる!電話番号へのリンクの貼り方

では、図解で解説していきます!

【ブログを書く】の画面で電話番号を入力

必ず半角で書いてくださいね!

ハイフンは入れても入れなくても、どちらでも大丈夫です。

電話番号を選択してリンクを張る

電話番号を選択した状態でリンクのボタンをクリック。

で、URLのところに「tel:該当の電話番号」を入力します。

アメブロ 電話番号 リンク

この例だったら「tel:090-0000-0000」になっていますね!

こちらも、ハイフンはあってもなくても大丈夫です。

HTMLの画面を開くとこんな表記になっています。

これでOK!

表示する文字を、電話番号以外にする事もできます!

この <> と <> に挟まれた部分の文字は変更可能です。

<a href=”tel:090-0000-0000″ target=”_blank”>090-0000-0000</a>

例えば、こんな文言を入れてみると・・・

「お電話でのお問い合わせはこちらをクリック!」という文字をタップすれば電話がかかる、という感じにまります。

HTMLに正しい電話番号がリンクされていれば、スマホからブログを開いて電話番号のリンクをタップするだけで電話がかけられます!

ちなみにこれはワードプレスなど他のブログでも使える方法です。

よろしければ、スマホの方は、これをタップしてみてくださいな♪

090-0000-0000

メールアドレスも!直接送信できるリンクの貼り方

タップして電話がかけられるのはとても便利ですが、メールアドレスも、タップしてメール送信画面に飛べるのは便利ですよね♪

メールアドレスももちろん電話番号と仕組みは同じなので、リンク先を

「mailto:該当のメールアドレス」

とすれば大丈夫です♪

アメブロ メール リンク

HTMLを見てみると、こんな記載になっています。

メールアドレスタップでメール アメブロ

電話番号の時と同じく、テキスト部分にはメールアドレスを入れてもいいし、文字だけにしてもOKです。

<a href=”mailto:info@outgoing.jp” target=”_blank”>info@outgoing.jp</a>

↑赤い部分がブログに文字として表示されます!

HTMLのほうにきちんとメールアドレスが記載されていればそちらへのメール送信ができる状態でメールアプリが起動します。

なので、連絡先はブログでこんな表示にすることもできますね♪

アメブロでの枠線の入れ方については、こちらの記事をご参考にどうぞ!

アメブロ 枠線の入れ方
アメブロの記事に枠線を入る方法~枠線の入れ方と注意点を解説!【動画あり】記事の中に枠線を入れるだけで、ぐっとブログは見やすくなります! また、メッセージボードや記事下定型文などは、むしろ枠線がないと、ど...
のりんちゅ先生
のりんちゅ先生
個人的には、お客さんからしたら、タップした先に何があるかわからないと、電話をかけたりメールをするのが不安になるので、電話番号・メールアドレスの表示のままの方が安心かなー、とは思います。
自分が電話する先が、固定回線なのか携帯電話なのかフリーダイヤルなのか?とか、知りたくないですかー??
パソコンで見ていてスマホでかける人は、むしろクリックしないといけなくてめんどくさくなっちゃいますしねぇ

メールアドレスのリンクも、アメブロだけでなくワードプレスでも同じ方法でできますので、よろしければこちらクリックして、メールアプリが起動するか試してみてください♡

info@outgoing.jp

のりんちゅ先生
のりんちゅ先生
ただし、連絡先については、できればメールアドレスじゃなくてお問合せフォームなどを作って設置しておく方が、わかりやすいし問合せもしやすいのでお勧めです♡

まとめ

  • サロンやお教室など、電話番号やメールアドレスを公開している
  • 電話予約/メール予約を受け付けている
  • キャンセル・変更・など、電話で連絡を受ける事が多い
  • わかりにくい場所にあって、電話で行き方を聞かれる事が多い

・・・そんな方!!

ブログに電話番号があっても、わざわざ電話番号を選択してコピーしてアプリを立ち上げてペーストして・・・って、
ものすごーーーくめんどくさいです!!

お悩みさん
お悩みさん
特に、時間ぎりぎりなのに道に迷って電話したい時とか、簡単にかけられないとホント困る・・

私、電話番号タップで電話がかけられないと諦める事が多いです・・。

あとは固定電話でかけたり、夫のスマホを借りたり、わざわざ電話番号を見るためにパソコンでサイトを開いたりね。

この方法だと、「HTMLとかよくわからない・・」という方でも簡単に設定できます♪

ちょっとの手間で、読者やお客様の手間を大幅に軽減できますので!!

ぜひぜひ、使ってみてくださいね~!

ABOUT ME
櫻井 法恵
ビジネスのための魅せるアメブロ・Facebook作りのアドバイザー。 2014年に事務管理・ブログ管理として起業。 2016年より、講師&アメブロコンサルタントとして活動を開始。 アメブロとFacebookのみを使い、約2年間でのべ500人を集客する。