Edgeで電話番号に自動的に貼られるリンクを無効にする方法

FRONTEND

2019.05.14

MicrosoftのブラウザEdgeでの表示時、ページ内に電話番号(と、電話番号っぽい数字の羅列)が記載されていると、勝手にリンクが貼られてしまいます。

今回はそのリンクを無効にする方法をご紹介します。

方法(1)番号を囲むタグで制御

1つ目の方法としては、下記のような記述でリンクを無効にすることが出来ます。

<p x-ms-format-detection="none">012-3456-7890</p>

x-ms-format-detection属性をnoneにすることでリンク無効、allでリンクが有効になります。

この方法の場合、該当する箇所一つ一つに設定する必要があるので、あまり多くの番号が記載されているページではちょっと大変です。

方法(2)メタタグにて制御

2つ目の方法はメタタグでリンクを無効にする方法です。これであれば一括でリンクを無効にすることが出来ます。この場合、<head>内に下記のように記述します。

<meta name="format-detection" content="telephone=no">

この方法だと、スマホで表示したときもリンクが無効になってしまいます。なので、ユーザーエージェントを併用して、「スマホのときはリンクを有効にする」等の設定が必要になってきます。