WordPressでクリックして電話をかけるリンクを作成する方法(ステップバイステップ)
公開: 2021-08-192020年にWebアクセスの68%が携帯電話から発生したことをご存知ですか?
同様に、2021年の第1四半期だけでも、携帯電話(タブレットを除く)が世界のWebサイトトラフィックの54.8%を占めました。
その結果、多くの企業は、自社のWebサイトに電子メールアドレスとは別にクリック可能な連絡先番号を含めています。 アイデアは、訪問者が電話をかけ、ワンクリックで連絡できるようにすることです。 あなたも、Click-to-Callリンクを作成することにより、そのような電話リンクをWebサイトに追加できます。
私たちが何について話しているのか分かりませんか?
心配しないでください。 この記事では、WordPressでClick-to-Callリンクを作成する方法を段階的に説明します。 進むにつれて、WordPressでクリック可能な番号とは何か、なぜそれが必要なのかについても説明します。
はじめに始めましょう:
目次
- WordPressのClick-to-Callリンクとは何ですか?
- WordPressにClick-to-Callリンクを追加する必要があるのはなぜですか?
- Click-to-Callリンクはどのように機能しますか
- WordPressでClick-to-Callリンクを作成する方法
- 方法1:プラグインを使用してClick-to-Callリンクを作成する
- 方法2:HTMLを使用したClick-to-Callリンクの追加
- 方法3:WordPressヘッダーにClick-to-Callリンクを追加する
- よくある質問
- HTMLでクリックコールリンクを作成するにはどうすればよいですか?
- Click-to-Callはどのように機能しますか?
- 今すぐ電話ボタンをWebサイトに追加するにはどうすればよいですか?
- 結論
WordPressのClick-to-Callリンクとは何ですか?
基本的に、Click-to-Callリンクは、サイトに追加した連絡先情報を1回クリックするだけで、モバイルユーザーが会社に電話をかけることができるクリック可能なリンクです。 モバイルユーザーの数は増加しており、携帯電話でのインターネットアクセスはかなり多いです。 したがって、Click-to-Callリンクは、ほとんどのWebサイトで広く使用されています。
WordPressにClick-to-Callリンクを追加する必要があるのはなぜですか?
ライブチャット、メール、お問い合わせフォーム、サポートチケットなど、顧客がビジネスとコミュニケーションをとるにはさまざまな方法があります。
これらはすべて信頼性が高く、役に立ちます。 ただし、特定の質問や質問がある場合は、直接電話を好む。 これは彼らに個人的なレベルで出席していると感じさせ、彼らの満足度を高めるかもしれません。
彼らの視点を考えると、1回のタップですばやく連絡できるので時間を節約できます。 さらに、番号を覚えてダイヤルする必要がないため、Click-to-Callリンクの方が便利です。
したがって、クリックして電話をかけるリンクは、訪問者が会社に連絡するためのより便利で簡単な方法です。
Click-to-Callリンクはどのように機能しますか
Click-to-Callリンクは、訪問者がリアルタイムであなたとつながるためのHTMLハイパーリンクです。 HTML 5には、Webブラウザが使用できるtel:およびmailto:プロトコルが含まれています。
各ブラウザは、これらのプロトコルに対して異なる応答をします。 たとえば、一部のブラウザは携帯電話で電話アプリを起動し、表示されている番号を自動的に追加して、携帯電話の通話ボタンをクリックするのを待ちます。 他のブラウザの中には直接電話をかけるものもあれば、ユーザーが電話番号のリンクをクリックしたときに電話をかけても大丈夫かどうかを尋ねるブラウザもあります。
Click-to-CallリンクはHTMLであるため、サイドバー、ヘッダー、フッター、ウィジェット内、コンテンツなど、サイトのどこにでも追加できます。
WordPressでClick-to-Callリンクを使用するもう1つの重要な利点は、マーケティングを具体的にすることです。 あなたはあなたのウェブサイトで電話番号のクリックを追跡し、あなたの訪問者があなたのサイトにどこから来ているかを知ることができます。 この情報を使用して、パーソナライズされたマーケティングキャンペーンを作成し、適切な情報を適切な人に適切なタイミングで表示できます。
WordPressでClick-to-Callリンクを作成する方法
WordPressでClick-to-Callリンクを作成して追加する方法は3つあります。 それらを段階的に詳しく説明しました。 以下でそれらを読んでください:
方法1:プラグインを使用してClick-to-Callリンクを作成する
プラグインを使用すると、Classic Editor、Gutenberg、サイドバー、およびスティッキーフローティングボタンでクリックして呼び出すボタンを簡単に作成および追加できます。 手順は次のとおりです。
ステップ1:プラグインのインストールとアクティブ化
- WordPressダッシュボードに移動します。 [プラグイン]> [新規追加]オプションをクリックします。

- 「 WPCallButton 」プラグインを検索します。 インストールしてアクティブ化します。

ステップ2:プラグインを構成する
WP Call Buttonプラグインをアクティブ化した後、それを構成する必要があります。 ダッシュボードの[設定]> [WP通話ボタン]オプションに移動します。

スティッキーコールボタンまたはスタティックコールボタンオプションを使用してプラグインを構成できます。 スティッキーボタンは、静的ボタンが静止している間、ユーザーがサイトをスクロールして閲覧するときにユーザーと一緒に移動します。

#スティッキーコールボタンの設定
まず、[今すぐ呼び出す]ボタンのステータスをオンに切り替えて、Webサイトのスティッキーな[呼び出しボタン]機能をアクティブにします。 スティッキーコールボタンの作成中には、4つの標準設定があります。 それに応じて情報を入力します。
- 通話ボタンのテキスト–サイトに表示される電話番号を入力します。 国コードを追加することもできます。
- ボタンの位置–Webサイトでのボタンの表示方法を構成します。
- 通話ボタンの色–通話ボタンの色を選択します。
- 可視性–特定のページの呼び出しボタンを非表示にします。
デスクトップではなくモバイルデバイスに通話ボタンを表示する場合は、モバイルデバイスに対してのみ通話ボタンをオンに切り替えることができます。 最後に変更を保存します。

これで、スクロールに沿って移動する呼び出しボタンがサイトに表示されます。

#静的呼び出しボタンの構成
WordPress Classic Editorで実行する場合は、静的呼び出しボタンを構成する必要があります。
- 上部の[静的呼び出しボタン]タブに移動します。
- 次に、通話ボタンのテキストを入力し、通話ボタンの色を選択します
- そうすることで、最後にショートコードが生成されます。 あなたはそれをコピーする必要があります。

次に、呼び出しボタンを追加するページ/投稿にショートコードを貼り付けます。 お問い合わせページに貼り付けることをお勧めします。 そこでは、静的な呼び出しボタンの方が理にかなっています。
次のようになります。

次のように、ブロックエディタを使用して呼び出しボタンを公開することもできます。
- ブロックエディタの追加アイコンをクリックします。
- WPコールボタンオプションを選択します。

- 右側で、通話ボタンの色、フォントサイズ、位置などを調整できます。
ウィジェットへの呼び出しボタンの追加
サイドバー、フッター、ヘッダー、その他の場所などのウィジェットに呼び出しボタンを追加することもできます。 方法は次のとおりです。

- ダッシュボードの[外観]> [ウィジェット]に移動します。

- WP CallButtonウィジェットまでスクロールします。
- 呼び出しボタンを追加するフッター、ヘッダー、サイドバー、またはその他のウィジェット領域にドラッグします。

- それをクリックして、ウィジェットを追加する場所を選択することもできます。
- [編集]ボタンをクリックして、タイトル、説明、色などを調整します。

したがって、これは、 WP CallButtonプラグインを使用してクリックツークリックボタンを作成する方法です。 WordPressサイトに通話ボタンを追加するのが最も簡単で便利な方法です。 これは無料のツールであり、GoogleAnalyticsとも統合されています。
方法2:HTMLを使用したClick-to-Callリンクの追加
HTMLスニペットを使用して、Click-to-Callリンクを手動で追加することもできます。 このメソッドは、単純なHTMLコードスニペットを使用して、携帯電話で電話リンクを開きます。 Windows 10ではSkypeを開き、MacではFacetimeを開きます。
次のように、HTMLを使用して呼び出しボタンのリンクを追加できます。
- まず、会社の電話番号と国コードを追加する投稿またはページを開きます。
- HTMLブロックを追加します。

次に、そのHTMLブロックに次のコードスニペットを追加します。
<!--This link will work on Android and iPhone. It will be visible to desktop users but will result in an error when clicked --> <a href="tel:+15555551212">+1 (555) 555-1212</a> <a href="tel:15555551212">Call Me</a>
- 最後に、それを公開してWebサイトに表示します。
Click-to-Callリンクの横にアイコンまたは画像を追加できます。 方法は次のとおりです。
- ダッシュボードの[メディア]> [新しいオプションの追加]に移動します。

- アイコンをアップロードします。
- アップロードが完了したら、アイコンを編集します。
- 編集画面からファイルのURLをコピーします。

最後に、アイコン付きの通話リンクを追加する投稿/ページに移動します。 前と同じようにHTMLブロックを追加し、次のコードスニペットを貼り付けます。
<a href="tel:+15555551212"><img src="paste-url-here" alt="Call us" /></a>
- ここのURLを前にコピーしたものに置き換えることを忘れないでください。 次に、それを公開します。
方法3:WordPressヘッダーにClick-to-Callリンクを追加する
また、サイトのヘッダーまたはナビゲーションメニューにClick-to-Callリンクを追加することもできます。 このように、呼び出しボタンは訪問者が最初に気付くものになります。 このメソッドを使用して呼び出しリンクを追加するには、次の手順に従います。
- ダッシュボードの[外観]> [メニュー]オプションに移動します。

- 右側の列から[カスタムリンク]オプションをクリックします。
- URLに「Tel:+144444444」の形式で電話番号を入力します。
- [リンクテキスト]フィールドに、通話リンクに付けるラベルを入力します。
- 「メニューに追加」ボタンをクリックします。

よくある質問
HTMLでクリックコールリンクを作成するにはどうすればよいですか?
WordPress HTMLブロックに次のコードを追加することで、HTMLでクリックコールリンクを作成できます。
<!–このリンクはAndroidとiPhoneで機能します。 デスクトップユーザーには表示されますが、クリックするとエラーが発生します–>
<a href=”tel:+ 15555551212 "> +1(555)555-1212 </a>
<a href=”tel:15555551212“>電話してください</a>
強調表示された部分を会社の連絡先番号に置き換えます。
Click-to-Callはどのように機能しますか?
Click-to-callは、tel:およびmailto:プロトコルで機能するHTMLリンクです。 これらのプロトコルにより、ブラウザは呼び出しを要求し、会話を開始できます。
今すぐ電話ボタンをWebサイトに追加するにはどうすればよいですか?
WP Call Buttonプラグインを使用して、Webサイトに今すぐ通話ボタンを追加するか、WordPressHTMLコードスニペットを手動で入力できます。 これらの方法について詳しく説明しました。 それらをチェックしてください。
結論
つまり、これらはWordPressでクリックして呼び出すリンクを作成する3つの簡単な方法でした。 プラグインはより速く、より安全で、便利な方法であるため、プラグインを使用することをお勧めします。 どのレベルのユーザーでも、他の方法に比べて簡単で便利です。 ただし、手動による方法でも同様に機能します。 しかし、あちこちのコードでもう少し作業する必要があります。
どの方法が簡単だと思いましたか? コメントで教えてください。