WordPressで電話番号に自動的にリンクを追加する方法

WordPressで電話番号に自動的にリンクを追加する方法

Photo Daria Nepriakhina via Unsplash

WordPressで本文中の電話番号に自動的にリンクを追加する方法を紹介します。スマホで電話番号をタップしたときに、すぐに電話がかけられるようになります。

見た目は次のように変わります。

Before

リンクなしの電話番号

After

リンクつきの電話番号

HTMLコードは次のように変わります。

Before

03-0000-0000

After

<a href="tel:03-0000-0000">03-0000-0000</a>

実装方法は簡単です。functions.phpに次のコードを追記します。

function add_phone_number_link( $content ) {
    $content = preg_replace( '/([0-9]{2,4}-[0-9]{2,4}-[0-9]{3,4})/', '<a href="tel:$1">$1</a>', $content );
    return $content;
}
add_filter( 'the_content', 'add_phone_number_link' );

これで、本文中の電話番号のテキストをリンクつきの状態に変換できます。

電話番号は「/([0-9]{2,4}-[0-9]{2,4}-[0-9]{3,4})/」で検索しています。0~9の数字の2~4回の繰り返し、ハイフン、0~9の数字の2~4回の繰り返し、ハイフン、0~9の数字の3~4回の繰り返し、というパターンです。固定番号以外に、携帯の電話番号や050で始まる電話番号にも対応しています。

人気の記事

2017年、人気の無料WordPressテーマ100選
2017年、人気の無料WordPressテーマ100選
2017年におすすめしたい、日本語対応の有料WordPressテーマ10選
2017年におすすめしたい、日本語対応の有料WordPressテーマ10選
アドセンス運用に最適なWordPressテーマ3選
アドセンス運用に最適なWordPressテーマ3選

コメント

  • Posted on
  • Updated on
  • Views 124