쇼핑몰에서 HTML로 전화번호 링크 거는 방법
스마트폰에서 홈페이지나 쇼핑몰을 보면 전화번호가 나옵니다. 고객들이 전화를 걸기 위해 전화번호를 클릭했을 때 스마트폰에서 바로 전화 걸기 모드로 바뀌게 만드는 방법에 대해 알아봅시다.
대부분의 경우 사이트에서 전화번호를 글자로 올려놓은 경우 클릭만 하면 알아서 전화걸기 모드로 바뀌게 됩니다. 그러나 되는 스마트폰이 있고, 안 되는 스마트폰이 있고 이미지로 전화번호를 올려놓은 경우에는 어쩔 수 없이 스마트폰에 일일이 적어서 전화를 거는 방법밖에 없습니다. 이런 애매모호하고 불편한 경우를 없애기 위한 HTML 전화번호 링크 방법입니다.
1. 번호를 클릭했을 때 전화로 바로 연결되는 링크
<a href="tel:쇼핑몰 전화번호">쇼핑몰 전화번호</a>사이트에서 전화번호를 적으실 때 html 모드에서 위 코드를 넣어주시면 됩니다. "쇼핑몰 전화번호"가 2개 나오는데 실제 전화번호를 2개에 다 입력하시면 됩니다. 앞의 전화번호는 실제 연결되는 전화번호이고 뒤에 나오는 전화번호는 고객에게 보여지는 전화번호입니다.
2. 이미지에 전화번호 링크거는 방법
<a href="tel:쇼핑몰 전화번호"><img src="이미지 링크"></a>1번과 동일한 방식으로 이미지나 사진에 전화번호를 링크 거실 수도 있습니다. 글자 대신 이미지가 들어가기만 하면 됩니다.
3. 번호를 클릭했을 때 문자로 바로 연결되는 링크
<a href="sms:쇼핑몰 전화번호">쇼핑몰 전화번호</a>전화번호와 마찬가지 방식인데 앞부분 'tel'을 'sms'로 바꿔주시기만 하면 문자 링크로 바뀌게 됩니다. 고객이 스마트폰에서 클릭했을 때 바로 해당 전화번호의 문자 작성 화면으로 넘어가는 링크입니다.
4. 이미지에 문자 링크거는 방법
<a href="sms:쇼핑몰 전화번호"><img src="이미지 링크"></a>이미지에 문자 링크 거는 방법도 위와 동일합니다. 전화번호를 이미지로 바꿔 주기만 하면 끝납니다.
간단한 html 코드만 잘 활용해도 고객들이 쇼핑몰이나 홈페이지를 사용할 때 조금 더 편리하게 사용할 수 있는 게 됩니다. 조그만 차이가 쌓여서 단골 고객들이 쌓이는 것이니 사용 안 하고 계시다면 한 번 사용해 보세요. 대 모바일 쇼핑 시대에 이런 건 기본적으로 해 놓으시면 좋습니다.
댓글