WordPressで電話番号をクリック可能にしたいですか？簡単な解決策をご紹介します

ウェブサイトに電話番号が表示されていますが、タップしても何も起こりません。これは WordPressでよくある問題 で、通話料がかかってしまう原因となっています。

WordPressのデフォルトでは、電話番号はクリックできません。モバイルでは、これが煩わしさを生み出します。訪問者はタップしてすぐに電話をかけられることを期待しています。それができないと、多くの人が躊躇したり、サイトを去ってしまいます。

修正は簡単です。適切な設定をすれば、WordPressで電話番号をクリック可能にすることができます。このガイドでは、信頼性の高い方法をステップバイステップでご紹介しています。これらの方法は、 ブロックテーマ やクラシックテーマなど、あらゆるWordPress設定でご利用いただけます。

TL;DR: WordPressで電話番号をクリック可能にする

• WordPress では、デフォルトでは電話番号をクリックできません。.
• WordPress で任意の電話番号をクリックできるようにするには、tel リンク形式を使用します。.
• Tel リンクは、投稿、ページ、メニュー、 ヘッダー、フッター、ウィジェットで機能します。
• 一貫した結果を得るには、tel リンク内のスペースと記号を削除します。.
• 会社で国際電話を受ける場合は、国番号を追加します。.
• ランディングページでの視認性を高めるには、ボタンを使用します。
• 電話が主なコンバージョン目標である場合にのみ、通話ボタン プラグインを使用します。.
• 公開する前に、必ず実際のモバイル デバイスで電話リンクをテストしてください。.

クリック可能な電話番号が想像以上に重要な理由

今日のウェブサイト訪問者のほとんどはモバイルデバイスからアクセスしています。スマートフォンでウェブサイトを閲覧する人は、瞬時のアクションを期待しています。番号をタップすると、ダイヤルが開くようにすべきです。コピーやアプリの切り替え、そして余計な思考は必要ありません。.

クリック可能な電話番号は、不要な手順を省きます。訪問者が行動を起こすまさにその瞬間に、クリック時のストレスを軽減します。これだけで、サイトの他の部分を変更することなく、通話数を増やすことができます。.

信頼性も重要です。はっきりと見え、タップ可能な電話番号は、ウェブサイトの背後に実在の企業があることを示すシグナルとなり、訪問者にワンタップでサポートを受けられるという安心感を与えます。.

アクセシビリティの観点からは、クリック可能な数字も同様に重要です。運動機能に障害のあるユーザーや支援技術を利用するユーザーは、コンテンツを操作する上で、適切にフォーマットされたリンクに依存します。.

検索エンジンはユーザーの意図も理解します。明確なユーザーアクションを促すページは、地域密着型検索やサービス重視の検索において、パフォーマンスが向上する傾向があります。クリック可能な電話番号自体はランキング要因ではありませんが、重要なユーザーエクスペリエンスシグナルを向上させます。

つまり、電話番号をクリック可能にすることは、単なる技術的な調整ではありません。 コンバージョンの向上 、ユーザビリティの向上、そして信頼の構築が一体となった効果なのです。

WordPressで電話番号をどこからでもクリック可能にする最も簡単な方法

WordPress のほぼすべての場所で機能する 1 つの方法が必要な場合は、これが最適です。.

WordPressでは、「tel」と呼ばれる特別なリンク形式を使用して、電話番号をクリック可能なリンクに変換できます。この形式は、ブラウザやモバイルデバイスに、リンクをクリックするとウェブページではなく電話ダイヤラーが開くことを伝えます。.

基本的な考え方を分かりやすく説明すると次のようになります。

• 電話番号をお預かりします。.
• ウェブサイトをリンクするのと同じ方法でリンクします。.
• URL を使用する代わりに、 tel に続けて番号を使用します。.

この方法は、投稿、ページ、 ウィジェット、メニュー、 フッター、サイドバー、さらにはカスタムHTMLブロックでも機能します。 ブロックエディター と クラシックエディター。また、追加の設定なしでほとんどのテーマで動作します。

一番良い点は、訪問者が目にする見た目が全く変わらないことです。ページ上の電話番号はこれまでと変わりませんが、スマートフォンでタップすると、すぐに電話をかけられるようになります。.

次のセクションでは、ほとんどのコンテンツが存在するエディターから始めて、 WordPress サイトのさまざまな部分にこの方法を適用する方法を詳しく説明します。

WordPressエディター内で電話番号をクリック可能にする方法

投稿やページに電話番号を追加する場合、 WordPress エディターから 始めるのが最も簡単です。

ブロックエディターの使用

あなたの電話番号がページ上で次のように表示されているとします: 717 867 5309

まず、段落ブロック内に通常のテキストとして電話番号を追加します。コンテンツ内の任意の場所に配置できます。.

次に、カーソルで電話番号をハイライトします。他のページへのリンクを作成するときと同じように、ブロックツールバーのリンクアイコンをクリックします。.

リンク フィールドに「tel」と入力し、その後にスペースや記号を入れずに電話番号を入力します。.

• たとえば、次のように入力します: tel:7178675309

リンクを適用すると、番号がクリック可能になります。ページを公開または更新すれば完了です。.

会社で国際電話を受ける場合は、プラス記号を追加して国番号を含めることができます。.

• 例: 電話番号:+17178675309

このアプローチは、モバイルデバイスや最新のブラウザで一貫して機能します。また、表示されるテキストを変更する必要がないため、コンテンツをすっきりと読みやすく保つことができます。.

プレーンテキストの代わりにボタンを使用する

電話番号を目立たせたい場合もあるでしょう。その場合は、ボタンを使うと便利です。.

WordPressボタンブロックを使うと、「今すぐ電話」ボタンを作成し、同じ電話番号形式でリンクすることができます。訪問者がボタンをタップすると、すぐに通話が始まります。.

ボタンはランディングページやお問い合わせセクションで特に効果的です。ただし、実際の電話番号をボタンの後ろに隠すと、電話をかける前に電話番号を確認したいユーザーもいることに注意してください。ユーザー層に合わせて、視認性とデザインのバランスを取りましょう。.

フッターまたはサイドバーにクリック可能な電話番号を追加する方法

多くのウェブサイトでは、電話番号をすべてのページで表示できるように、フッターやサイドバーに配置しています。WordPressでは、ウィジェットエリアを使って簡単に表示できます。.

WordPressダッシュボードから「外観」を選択し、「ウィジェット」を選択します。電話番号を表示したいウィジェットエリアを選択します。テーマによっては、フッター列またはサイドバーセクションに表示できます。

段落ブロックまたはテキストウィジェットを追加し、電話番号を通常のテキストとして入力します。その後、エディターで使用したのと同じtelリンクメソッドを適用します。.

保存すると、そのウィジェット領域がアクティブなすべてのページに電話番号が表示されます。.

モバイル端末での動作には注意が必要です。ほとんどのモバイル端末では、サイドバーとフッターはメインコンテンツの後に表示されます。電話対応を重視するビジネスの場合は、ヘッダーや問い合わせページと合わせてフッターの番号を表示することを検討してください。.

WordPressメニューにクリック可能な電話番号を追加する

電話番号を常に表示したい場合、特にヘッダー部分に表示したい場合があります。WordPress メニュー 、それを実現する最も効果的な方法の一つです。

これは、訪問者がスクロールしたり連絡先の詳細を探したりせずにすぐに電話をかけたいサービスベースのビジネスに特に適しています。.

WordPressメニューに電話番号を追加する方法

次の手順に従ってください。

1. WordPressダッシュボードを開く
2. 「外観」から「メニュー」へ進みます
3. メニュー項目の追加で、カスタムリンクを選択します。

URL欄に電話番号を「tel」形式で入力してください。
例：
tel:7178675309

「リンク テキスト」フィールドでは、次の操作を実行できます。

• 実際の電話番号を追加する
• または、「今すぐ電話」や「専門家に相談」などの行動喚起を使用します。

[メニューに追加] をクリックし、必要に応じて位置を調整して、メニューを保存します。.

公開されると、電話番号がナビゲーション バーに直接表示され、モバイル デバイスでクリックできるようになります。.

ブロックベースのテーマの使用

ブロック ベースのテーマを使用しており、メニュー オプションが表示されない場合は、代わりにサイト エディターを使用する必要があります。

コンセプトは変わりません。従来のメニュー画面ではなく、ナビゲーションブロック内に電話リンクを追加します。.

HTMLを使用して電話番号をクリック可能にする

WordPressエディターでは十分な柔軟性が得られない状況もあるかもしれません。例えば、 カスタムテンプレート、コードブロック内にコンテンツを追加したり、あるいはWordPressの外部で作業したりする場合などです。

このような場合は、基本的な HTML を使用して電話番号をクリック可能にすることができます。.

構造はシンプルです。電話番号をリンクタグで囲み、href属性にtel形式を使用します。.

例えば、コードは次のようになります

<a href=”tel:7178675309″>717 867 5309</a>

国際国番号を含める場合は、番号の前にプラス記号を追加します。.

この方法は、ブラウザやデバイスを問わず確実に機能します。ただし、href 値内の数字からスペースと記号を削除することを忘れないでください。.

HTMLベースの電話番号リンクは、控えめかつ慎重に使用することをお勧めします。コードの編集に慣れていない場合は、前述のエディタベースの方法の方が安全でメンテナンスも容易です。.

クリックツーコール機能にプラグインを使うべきか

多くのウェブサイトでは、telリンク方式で十分です。ただし、 プラグインを使用する方 が適切な場合もあります。

ビジネスで電話による問い合わせが多用されている場合、プラグインを利用することで、クリック可能な電話番号以上の機能を追加できます。例えば、フローティング通話ボタン、モバイル限定表示、時間ベースの表示ルール、通話トラッキングなどです。.

プラグインは、ユーザーがスクロールしても「今すぐ電話」ボタンが表示され続けるようにしたい場合に特に便利です。また、場所やデバイスの種類に応じて異なる電話番号を表示したい場合にも役立ちます。.

とはいえ、プラグインをデフォルトで第一選択肢にすべきではありません。プラグインはサイトに余分なコードを追加し、継続的なアップデートが必要になります。.

良い目安は次のとおりです。

• クリック可能な電話番号だけが必要な場合は、tel リンクを使用します。.
• 通話が主要なコンバージョン目標であり、追跡や高度な動作が必要な場合は、プラグインを検討してください。.

WordPressで「今すぐ電話」ボタンを作成する

「今すぐ通話」ボタンは、訪問者がワンタップで電話をかけることができるフローティングボタンまたは固定ボタンです。これらのボタンは主にモバイルユーザー向けに設計されています。.

ボタンのインストールと設定

通話ボタン プラグインをインストールした後、通常はボタンを有効にして電話番号を入力するように求められます。.

電話番号にはスペースや記号が含まれないようにしてください。国際電話を受ける場合は、国番号とプラス記号を入力してください。.

ほとんどのプラグインでは、ボタンをモバイル端末のみに表示するか、デスクトップにも表示するかを選択できます。デフォルトでは、モバイルのみの表示が最適なオプションです。.

有効にすると、各ページに手動で配置する必要なく、ボタンがサイトに自動的に表示されます。.

スタイルと表示オプション

ほとんどの通話ボタンプラグインは基本的なカスタマイズが可能です。色、ボタンの位置、場合によってはテキストラベルも調整できます。

一般的な配置オプションには、右下、左下、または全幅バーなどがあります。重要なコンテンツを隠したり、ナビゲーションを妨げたりしない配置を選択してください。.

過度に攻撃的なデザインは避けてください。通話を邪魔するのではなく、快適に通話できるようにするのが目的です。.

クリック可能な電話番号でコンバージョン率を高めるためのベストプラクティス

電話番号をクリック可能にする方法を知っているだけでは、まだ半分しか理解できません。どのように提示するかも同様に重要です。.

モバイルで電話番号を簡単にタップできるようにする

ウェブサイトからの電話発信のほとんどはモバイルから行われます。つまり、電話番号はタップしやすいものにする必要があります。.

読みやすいフォントサイズを使用してください。電話番号を他のリンクに近づけすぎないようにしてください。ユーザーが誤って別の要素をタップしてしまうことがないように、十分な間隔を空けてください。.

可能であれば、実際のスマートフォンでサイトをテストしてください。マウスで簡単にクリックできる操作でも、タッチスクリーンでは操作しづらいと感じるかもしれません。.

サイト上で電話番号を表示する場所

電話番号は、見つけやすい場所に設置すると最も効果的です。効果的な設置場所として、ヘッダー、お問い合わせページ、 主要なランディングページ。

フッターとサイドバーは視認性を高めるのに役立ちますが、通話がビジネスにとって重要である場合、電話番号をそこにのみ配置すべきではありません。.

視認性を高めるスタイリングのヒント

コントラストを使うことで、電話番号を目立たせることができます。ボタン、アイコン、あるいはさりげないハイライトは、ページを圧迫することなく注目を集めます。.

数字がクリック可能であることを明確に示してください。ユーザーが推測する必要がないようにしてください。.

クリックして通話するリンクを追加するときに避けるべきよくある間違い

よくある間違いの一つは、telリンク内にスペースや記号を使用することです。これにより、一部のデバイスでリンクが失敗する可能性があります。.

電話番号を小さくしすぎたり、他のクリック可能な要素の近くに配置したりするのも間違いです。これは誤クリックやフラストレーションにつながります。.

プラグインの過剰使用もよくある問題です。シンプルなリンクで十分であれば、余計な複雑さを加える必要はありません。.

最後に、公開する前に必ずモバイル端末で電話リンクをテストしてください。通話リンクが壊れていると、本来の目的が達成されません。.

クリック可能な電話番号だけでは不十分な場合

ビジネスが成長するにつれて、クリック可能な数字以上のものが必要になる場合があります。.

どのページから電話がかかってきたかを追跡したい場合もあるでしょう。場所や時間帯に応じて異なるルーティングを設定したい場合もあるでしょう。あるいは、不在着信を専門的に処理してもらいたい場合もあるでしょう。.

この段階では、クリック可能な電話番号は、独立したソリューションではなく、より大規模なコンバージョンおよびサポート戦略の一部になります。.

最後に

WordPress で電話番号をクリック可能にすることは、Web サイトに行うことができる最も簡単な改善点の 1 つです。.

これにより、摩擦がなくなり、使いやすさが向上し、訪問者が行動する準備ができた瞬間に連絡できるようになります。.

ほとんどのウェブサイトでは、WordPressエディター、メニュー、ウィジェット内でtelリンクメソッドを使用するだけで十分です。高速で信頼性が高く、メンテナンスも簡単です。.

電話がビジネスで重要な役割を果たしている場合は、後からいつでも通話ボタンや追跡機能を追加できます。.

まずはシンプルに。モバイルでテストし、ユーザーが簡単にアクセスできるようにします。.

よくある質問