티스토리 글쓰기 HTML 모드에서 전화번호 링크걸기 진행하는 방법
어떤 분께서 혹시 티스토리에도 전화번호 링크가 가능한지를 여쭤보셨습니다. 물론 가능합니다. a 링크 태그를 이용해서 진행 할 수 있습니다. 또한 img 태그를 추가하여 이미지배너 타입으로 전화번호 링크도 생성 가능합니다. 그러면 한번 어떻게 하는지 살펴봅시다.
일반 텍스트에 전화번호 링크걸기
먼저 아래의 태그를 살펴봐주세요.
<a href="tel:전화번호">전화걸기</a>아주 간단한 태그죠? 그렇습니다. 보통 a href 태그 다음에는 url 주소를 넣는게 일반적입니다. 여기에서 URL 주소 대신 전화번호를 입력 할 수 있습니다. 단 tel: 이라는 태그를 함께 입력해줘야 합니다. 이것만 주의하시면 됩니다. 위의 예시를 바탕으로 완성된 결과가 아래에 있습니다.
이 페이지를 스마트폰에서 확인했을 때, 전화걸기 텍스트를 터치하면 실제 전화가 걸리게 됩니다. 다이얼 화면으로 넘어가게 되는 것 입니다. 완전 편리합니다.
이미지에 전화번호 링크걸기
위에서 소개해드린 방법에 img 태그만 추가한 형태 입니다. 따라서 배너로 사용할 jpg 혹은 gif, png 등의 이미지 포맷 파일이 하나 필요하며 URL 주소로 입력해야 하기 때문에 티스토리 파일함이나 본문에 미리 업로드를 해놔야 합니다. 이곳에 예시로 하나 올려놓도록 하겠습니다. 그리고 예시 이미지에 위의 a 태그를 그대로 적용시켰습니다.
현재 위의 다이얼 이미지에는 전화번호 태그가 들어있습니다. 따라서 모바일에서 위의 이미지를 터치하면 스마트폰의 다이얼 화면으로 넘어가게 됩니다. 태그 형태는 다음과 같습니다.
<a href="tel:전화번호"><img src="이미지주소" alt="전화번호"></a>그렇습니다. 이렇게 완성이 됩니다. 일반적인 방법과 차이점이 눈에 보이시죠? img 태그만 가운데 넣은 것 입니다. 이렇게 작업하시면 됩니다. 티스토리에서 글 작성 시 HTML 모드로 변경 후 번거롭더라도 수동으로 태그를 삽입하면 됩니다. 끝.
