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

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で始まる電話番号にも対応しています。