워드프레스 전화번호 자동 링크 해제하기 (클릭 방지)

목차
1. 전화번호 자동 링크 상황
2. 전화번호에 대한 자동 링크 해제하기
3. 결과


워드프레스에서 전화번호 형식의 텍스트를 입력하고 (PC가 아닌) 스마트폰으로 해당 웹페이지를 모바일 버전으로 보게 되면 자동으로 링크가 걸리는 기능이 포함되어 있다.

일반적으로 전화번호를 입력하는 상황에서는 해당 번호를 안내하는 상황이기 때문에 자동으로 링크가 걸려 쉽게 전화를 걸 수 있다면 꽤나 편리하다. 특히 상업적인 페이지를 운영하는 경우.

다만, 일반적인 블로그에서 전화번호 형식의 양식은 전화번호가 아닌 경우도 있고, 클릭하면 안 되는 (스미싱 주의를 안내하는 등의) 포스트일 수도 있다. 이 경우 전화번호에 링크가 걸려 있다면 오히려 방문자가 실수로 클릭을 할 수 있다. 물론 전화 걸기 버튼을 한 번 더 눌러야 전화가 걸리기는 하지만 글 쓴 이의 의도와는 전혀 다른 결과를 초래할 수 있다는 점은 주의할 필요가 있다.


1. 전화번호 자동 링크 상황

PC 버전에서는 활성화되지 않지만 모바일 버전에서는 전화번호 링크가 활성화되는 모습을 볼 수 있다.

Phone number PC
PC에서는 링크가 활성화되어 있지 않음

Phone number Mobile
전화번호 자동 링크(모바일)
Phone number clickable Mobile
클릭하면 통화 기능 실행됨


2. 전화번호에 대한 자동 링크 해제하기

해당 기능을 비활성화하기 위해서는 <head> 영역에 내용을 추가해야 한다. 헤더 편집 플러그인을 사용하고 있다면 아래의 내용을 입력하고,

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


헤더에 내용을 직접 추가하는 경우에는 워드프레스 functions.php에 다음 내용을 추가하자. functions.php 내용에 이미 헤더 추가 영역(wp_head() 후크(액션))이 들어가 있다면, 마찬가지로 <meta name ~~> 부분만 추가해 주면 된다.

외모 > 테마 파일 편집기 > Theme Functions (functions.php)

function additional_head() {
?>
<meta name="format-detection" content="telephone=no">
    <?php
}
add_action('wp_head', 'additional_head');
Phone number unclickable functions
테마 파일 편집 (functions.php)

*코드 참조 : wordpress.org


3. 결과

Phone number unclickable result
모바일에서 전화번호 링크 해제

카테고리의 다른 글

  1. 워드프레스 아카이브(카테고리, 태그 등) 페이지 헤더 숨기거나 높이 조절하기
  2. 워드프레스 검색 결과에서 댓글 링크 숨기기 (Leave a comment)
  3. 워드프레스 웹 페이지 속도 끌어 올리기 by 로컬 폰트 (feat. PageSpeed Insights)
  4. 클라우드웨이즈 추천 할인 쿠폰(크레딧)
  5. 클라우드웨이즈에서 워드프레스 1개월 반을 되돌아보는 후기

댓글 남기기