wordpressスマホ対応サイト・wpプラグイン・検索体験最適化・SNS・ 動画・bgmやテーマ曲を駆使して、リアルビジネスへの集客を達成するためのコラム!

   

wordpress屋のマルチメディアコンテンツ制作読んどけ☆コラム

【wpプラグイン】ワードプレスサイトに、スマホで電話機能をつけられる『Really Simple Click To Call』

      2018/05/01

こんにちは、管理人@SS_mshpです。

今回は、スマホで電話する機能を、ワードプレスサイトに実装できるプラグインを紹介します。

飲食店で料理の相談をしたり、スクールやコンサル系で詳しく教えてもらったりと、メールやlineを打つよりも、『電話したほうが早い』というケースは多くあります。さっそく実際に使ってみましょう。

■Really Simple Click To Callの設定方法


まずはプラグインの新規追加で検索フォームに『Really Simple Click To Call』といれます。この、スマホにボタンがついたような画像がでてくるので、インストール&有効化。有効化すると、メニューの設定部分に、このプラグインの欄が出てきます。


設定の画面はこんな感じ。『Enable Click to Call』にチェックをつけると、電話するボタンが表示されます。『Call Message』にはボタンに表示する文言を書き、『Call Number』で番号を指定。あとは色を決めれば完了と、非常にシンプルです。
CSSでも作れるんですが、下部fixしたり、z-indexで上に重ねたり、いろいろ大変です(笑)

■Really Simple Click To Callの、電話するボタンの表示のされ方

■pc版では表示されない


このサイトにつけてみたところ、PCビューでは表示されませんでした。というのも、メディアクエリで・・
@media (min-width: 737px) {
#click_to_call_bar {display: none;}
}
のように、737px以上になるとdisplay: none;になるように指定されているからです

■スマートフォンでアクセスすると、下部に電話するボタンが現れる


ユーザーエージェント判別ではなくメディアクエリ切り替えですが、スマートフォンでアクセスすると、このように下部に電話するボタンがでます。片手操作時に、親指でとどくギリギリ位置かなといった印象(管理人は片手スマホ操作ができません)。

■細かく調整したいときは、プラグインのCSSをエディットしよう


ワードプレスのプラグイン→プラグイン編集→右上の編集したいプラグイン選択で『Really Simple Click To Call』を選ぶ→CSSで、レイアウトなどを変更できます。文字をさらに大きくしたり、パディング多めに、などというときは使えそうです。

■あとがき・まとめ

通常のHTMLサイトに、電話するボタンをつけるとなると、細かいCSSの設定が必要になって大変ですが、ワードプレスなら『Really Simple Click To Call』を使うと簡単でした。CSSエディットをしなくても、簡単な設定ですぐボタンを実装できるので、かなり便利です。

*アトリエSS・web制作サービスページに移動します。webリニューアル・ロゴ・記事・wordpress化などでお力添えできます。

【カテゴリ】 - wordpressプラグイン(拡張)情報, サイトのモバイル対応 【タグ】 -

Message

メールアドレスが公開されることはありません。

  関連記事

【WPプラグイン】月額無料でレストラン・カフェなど飲食店の予約に使える『Restaurant Reservations』

今回は、飲食店でワードプレスサイトを持ったときに効果を発揮する、月額無料 …

【wpプラグイン】SiteGuard WP Pluginってどんな風にセキュリティに強くなるの?

今回は、サイト乗っ取りとか不正ログインみたいなリスクを減らせそうなワード …

【WPプラグイン】PDFで、ワードプレスを電子書籍風にできる『PDF light viewer』

今回は、ワードプレス&WPプラグインを使って、めくれる電子書籍風のページ …

ワードプレスサイトを、プラグインでサクッとSSL化する方法

今回は、セキュリティの観点からも重要なサイトSSL(暗号化接続)を、ワー …

ワードプレスサイトに、コメント機能を実装しない/非表示に

今回は、ブログサイトによくある『コメント機能』を、実装しない方法を考えて …

【WordPressとGoogleカレンダー連携プラグイン】Simple Calendarの設定・Calendar APIやID取得しての設定

今回は、WordPressサイトに、googleアカウントがある人ならみ …

【WPプラグイン・サイト高速化】EWWW Image Optimizerで、画像をサクッと圧縮して表示を速くしよう

今回は、サイトの高速化で、画像を圧縮してくれるものを試します 画像サイズ …

ワードプレスの『AllinOne SEOPack』って、なぜ・どんな仕組みで検索に強くなるの?

今回は、ワードプレスの検索エンジン最適化用プラグインが、どんな仕組みで検 …

【wordpressで教室・個別相談・サロン予約受付】プラグインEasy Appointmentsの設定・サイト実装方法を詳しく解説

今回は、特定の形態のビジネスで、『カレンダーつき予約フォームで、お客さん …

【wpプラグイン】ワードプレスサイトで、スマホアクセス時だけ軽量テーマに切り替える方法

今回は、スマホでみるとワードプレスサイトがちょっと重い件について対策して …