WordPress에서 클릭 투 콜 링크를 만드는 방법(단계별)

게시 됨: 2021-08-19

2020년 웹 방문의 68%가 휴대전화에서 발생했다는 사실을 알고 계셨습니까?

마찬가지로 2021년 1분기에만 휴대폰(태블릿 제외)이 전 세계 웹사이트 트래픽의 54.8%를 차지했습니다.

그 결과 많은 기업이 웹사이트에 이메일 주소 외에 클릭 가능한 연락처 번호를 포함시켰습니다. 아이디어는 방문자가 전화를 걸고 클릭 한 번으로 연락할 수 있도록 하는 것입니다. 클릭 투 콜 링크를 만들어 웹사이트에 전화 링크를 추가할 수도 있습니다.

우리가 무슨 말을 하는지 모르십니까?

걱정하지 마세요. 이 기사에서는 WordPress에서 클릭 투 콜 링크를 만드는 방법을 단계별로 설명합니다. 진행하면서 WordPress에서 클릭 가능한 숫자가 무엇이고 왜 필요한지 설명합니다.

소개부터 시작하겠습니다.

목차

  • WordPress의 클릭 투 콜 링크란 무엇입니까?
  • WordPress에 클릭 투 콜 링크를 추가해야 하는 이유는 무엇입니까?
  • 클릭 투 콜 링크 작동 방식
  • WordPress에서 클릭 투 콜 링크를 만드는 방법
    • 방법 1: 플러그인을 사용하여 클릭 투 콜 링크 만들기
    • 방법 2: HTML로 클릭 투 콜 링크 추가
    • 방법 3: WordPress 헤더에 Click-to-Call 링크 추가
  • 자주 묻는 질문
    • HTML에서 클릭 호출 링크를 만드는 방법은 무엇입니까?
    • 클릭 투 콜은 어떻게 작동합니까?
    • 웹사이트에 지금 통화 버튼을 추가하는 방법은 무엇입니까?
  • 결론

WordPress의 클릭 투 콜 링크란 무엇입니까?

기본적으로 클릭 투 콜 링크는 모바일 사용자가 사이트에 추가한 연락처 정보를 한 번만 클릭하여 회사에 전화를 걸 수 있는 클릭 가능한 링크입니다. 모바일 사용자의 수가 증가하고 휴대전화를 통한 인터넷 방문이 상당히 높습니다. 따라서 클릭 투 콜 링크는 대부분의 웹사이트에서 널리 사용됩니다.

WordPress에 클릭 투 콜 링크를 추가해야 하는 이유는 무엇입니까?

라이브 채팅, 이메일, 문의 양식, 지원 티켓 등 고객이 비즈니스와 커뮤니케이션할 수 있는 다양한 방법이 있습니다.

이 모든 것이 신뢰할 수 있고 도움이 됩니다. 그러나 사람들은 특정 질문이나 질문이 있을 때 직접 전화를 선호합니다. 이것은 그들이 개인적인 수준에서 관심을 받고 있다는 느낌을 갖게 하고 만족도를 높일 수 있습니다.

이들의 입장을 생각해보면 탭 한 번으로 빠르게 연락할 수 있어 시간을 절약할 수 있다. 또한, 클릭 투 콜 링크는 번호를 기억하고 다이얼할 필요가 없어 더욱 편리합니다.

따라서 클릭 투 콜 전화 링크는 방문자가 회사에 연락할 수 있는 보다 편리하고 쉬운 방법입니다.

클릭 투 콜 링크 작동 방식

클릭 투 콜 링크는 방문자가 실시간으로 귀하와 연결되도록 유도하는 HTML 하이퍼링크입니다. HTML 5에는 웹 브라우저에서 사용할 수 있는 tel: 및 mailto: 프로토콜이 포함되어 있습니다.

각 브라우저는 이러한 프로토콜에 다르게 응답합니다. 예를 들어, 일부 브라우저는 휴대폰에서 전화 앱을 실행하고 디스플레이에 자동으로 번호를 추가하여 휴대폰의 통화 버튼을 클릭하기를 기다립니다. 일부 브라우저는 직접 전화를 걸지만 다른 브라우저는 사용자가 전화번호 링크를 클릭하면 전화를 걸어도 괜찮은지 묻습니다.

클릭 투 콜 링크는 HTML이므로 사이드바, 머리글, 바닥글, 위젯 내, 콘텐츠 등 사이트 어디에나 추가할 수 있습니다.

WordPress에서 클릭 투 콜 링크를 사용하는 또 다른 중요한 이점은 마케팅을 구체적으로 만드는 것입니다. 웹사이트에서 전화번호 클릭을 추적하고 방문자가 어디에서 사이트를 방문하는지 알 수 있습니다. 이 정보를 사용하여 개인화된 마케팅 캠페인을 만들고 적시에 적절한 사람들에게 적절한 정보를 표시할 수 있습니다.

WordPress에서 클릭 투 콜 링크를 만드는 방법

WordPress에서 클릭 투 콜 링크를 만들고 추가하는 세 가지 방법이 있습니다. 단계별로 자세히 설명했습니다. 아래에서 읽어보세요.

방법 1: 플러그인을 사용하여 클릭 투 콜 링크 만들기

플러그인을 사용하면 클래식 편집기, 구텐베르그, 사이드바 및 고정 부동 버튼에서 클릭 투 콜 버튼을 훨씬 쉽게 만들고 추가할 수 있습니다. 단계는 다음과 같습니다.

1단계: 플러그인 설치 및 활성화

  • WordPress 대시보드로 이동합니다. 플러그인 > 새로 추가 옵션 을 클릭합니다.
대시보드에서 새 플러그인 추가
  • " WP 통화 버튼 " 플러그인을 검색하십시오. 설치하고 활성화하십시오.
WP 통화 버튼 플러그인 설치 및 활성화

2단계: 플러그인 구성

WP 통화 버튼 플러그인을 활성화한 후 구성해야 합니다. 대시보드에서 설정 > WP 통화 버튼 옵션으로 이동합니다.

WP 통화 버튼 플러그인 구성

고정 통화 버튼 또는 고정 통화 버튼 옵션을 사용하여 플러그인을 구성할 수 있습니다. 고정 버튼은 고정 버튼이 고정되어 있는 동안 사용자가 사이트를 스크롤하고 탐색할 때 함께 이동합니다.

WP 통화 버튼을 구성하는 두 가지 옵션

#고정통화버튼 설정하기

먼저 지금 통화 버튼 상태 를 켜서 웹사이트의 고정 통화 버튼 기능을 활성화합니다. 고정 통화 버튼을 만드는 동안 4가지 표준 설정을 찾을 수 있습니다. 그에 따라 정보를 입력하십시오:

  • 통화 버튼 텍스트 – 전화번호가 사이트에 표시될 내용을 입력합니다. 국가 코드를 추가할 수도 있습니다.
  • 버튼 위치 – 버튼이 웹사이트에 표시되는 방식을 구성합니다.
  • 통화 버튼 색상 – 통화 버튼의 색상을 선택합니다.
  • 가시성 – 특정 페이지에서 통화 버튼을 숨깁니다.

통화 버튼을 데스크탑이 아닌 모바일 장치에 표시하려면 모바일 장치에 대해서만 통화 버튼을 토글할 수 있습니다. 마지막에 변경 사항을 저장합니다.

모바일 기기에서만 통화 버튼

이제 스크롤과 함께 이동하는 호출 버튼이 사이트에 나타납니다.

고정 통화 버튼 미리보기

#정적 호출 버튼 구성

WordPress Classic Editor에서 실행하는 경우 정적 호출 버튼을 구성해야 합니다.

  • 상단의 정적 호출 버튼 탭으로 이동합니다.
  • 이제 통화 버튼 텍스트를 입력하고 통화 버튼 색상을 선택합니다.
  • 그렇게 하면 끝에 단축 코드가 생성됩니다. 복사해야 합니다.
정적 호출 버튼의 단축 코드 복사

이제 호출 버튼을 추가하려는 페이지/게시물에 단축 코드를 붙여넣습니다. 연락처 페이지에 붙여넣는 것이 좋습니다. 정적 통화 버튼이 더 적합합니다.

다음과 같이 보일 것입니다.

정적 통화 버튼 미리보기

다음과 같이 블록 편집기를 사용하여 통화 버튼을 게시할 수도 있습니다.

  • 블록 편집기에서 추가 아이콘을 클릭하십시오.
  • WP 통화 버튼 옵션을 선택합니다.
블록 편집기에서 WP 호출 버튼 추가
  • 오른쪽에서 통화 버튼 색상, 글꼴 크기, 위치 등을 조정할 수 있습니다.

위젯에 통화 버튼 추가

사이드바, 바닥글, 머리글 및 기타 위치와 같은 위젯에 통화 버튼을 추가할 수도 있습니다. 방법은 다음과 같습니다.

  • 대시보드에서 모양 > 위젯 으로 이동합니다.
위젯으로 이동
  • WP 통화 버튼 위젯으로 스크롤합니다.
  • 통화 버튼을 추가하려는 바닥글, 머리글, 사이드바 또는 기타 위젯 영역으로 드래그합니다.
사이드바에 WP 통화 버튼 위젯 추가
  • 위젯을 클릭하고 위젯을 추가할 위치를 선택할 수도 있습니다.
  • 편집 버튼을 클릭하여 제목, 설명, 색상 등을 조정합니다.
WP 통화 버튼 위젯 편집

이것이 WP Call Button 플러그인 을 사용하여 클릭 투 클릭 버튼을 만드는 방법입니다. WordPress 사이트에 통화 버튼을 추가하는 가장 쉽고 편리한 방법입니다. 무료 도구이며 Google Analytics와도 통합됩니다.

방법 2: HTML로 클릭 투 콜 링크 추가

HTML 스니펫을 사용하여 수동으로 클릭 투 콜 링크를 추가할 수도 있습니다. 이 방법은 간단한 HTML 코드 조각을 사용하여 휴대폰에서 전화 링크를 엽니다. Windows 10에서는 Skype가 열리고 Mac에서는 Facetime이 열립니다.

다음과 같이 HTML로 통화 버튼 링크를 추가할 수 있습니다.

  • 먼저 국가 코드와 함께 회사 전화번호를 추가하려는 게시물이나 페이지를 엽니다.
  • HTML 블록을 추가합니다.
HTML 블록 추가

이제 해당 HTML 블록에 다음 코드 스니펫을 추가합니다.

 <!--This link will work on Android and iPhone. It will be visible to desktop users but will result in an error when clicked --> <a href="tel:+15555551212">+1 (555) 555-1212</a> <a href="tel:15555551212">Call Me</a>
  • 마지막으로 게시하여 웹사이트에서 볼 수 있습니다.

클릭 투 콜 링크 옆에 아이콘이나 이미지를 추가할 수 있습니다. 방법은 다음과 같습니다.

  • 대시보드에서 미디어 > 새로 추가 옵션으로 이동합니다.
새 미디어 추가
  • 아이콘을 업로드합니다.
  • 이제 업로드가 완료된 후 아이콘을 수정합니다.
  • 편집 화면에서 파일 URL을 복사합니다.
미디어 URL 복사

마지막으로 아이콘이 있는 통화 링크를 추가하려는 게시물/페이지로 이동합니다. 이전과 같이 HTML 블록을 추가하고 다음 코드 스니펫을 붙여넣습니다.

 <a href="tel:+15555551212"><img src="paste-url-here" alt="Call us" /></a>
  • 여기서 URL을 이전에 복사한 URL로 바꾸는 것을 잊지 마십시오. 그런 다음 게시합니다.

방법 3: WordPress 헤더에 Click-to-Call 링크 추가

사이트 헤더 또는 탐색 메뉴에 클릭 투 콜 링크를 추가하도록 선택할 수도 있습니다. 이렇게 하면 방문자가 가장 먼저 통화 버튼을 보게 됩니다. 이 방법을 사용하여 통화 링크를 추가하려면 다음 단계를 따르세요.

  • 대시보드에서 모양 > 메뉴 옵션으로 이동합니다.
메뉴로 이동
  • 오른쪽 열에서 사용자 지정 링크 옵션을 클릭합니다.
  • URL 에 전화번호를 "Tel:+144444444" 형식으로 입력하세요.
  • 링크 텍스트 필드에 통화 링크에 부여할 레이블을 입력합니다.
  • " 메뉴에 추가 " 버튼을 클릭합니다.
메뉴에 사용자 정의 링크 추가

자주 묻는 질문

HTML에서 클릭 호출 링크를 만드는 방법은 무엇입니까?

WordPress HTML 블록에 다음 코드를 추가하여 HTML에서 클릭 호출 링크를 만들 수 있습니다.

<!–이 링크는 Android 및 iPhone에서 작동합니다. 데스크톱 사용자에게 표시되지만 클릭하면 오류가 발생합니다. ->
<a href="tel:+ 15555551212 ">+1 (555) 555-1212</a>
<a href="tel: 15555551212 ">전화하세요</a>

강조 표시된 부분을 비즈니스 연락처 번호로 바꿉니다.

클릭 투 콜은 어떻게 작동합니까?

클릭 투 콜은 tel: 및 mailto: 프로토콜과 함께 작동하는 HTML 링크입니다. 이러한 프로토콜을 통해 브라우저는 통화를 요청하고 대화를 시작할 수 있습니다.

웹사이트에 지금 통화 버튼을 추가하는 방법은 무엇입니까?

WP 통화 버튼 플러그인을 사용하여 웹사이트에 지금 통화 버튼을 추가하거나 WordPress HTML 코드 스니펫을 수동으로 입력할 수 있습니다. 이러한 방법을 자세히 설명했습니다. 한번 봐봐.

결론

이것이 WordPress에서 클릭 투 콜 링크를 만드는 세 가지 쉬운 방법입니다. 플러그인을 사용하는 것이 더 빠르고 안전하며 편리한 방법이므로 사용하는 것이 좋습니다. 모든 레벨의 사용자는 다른 방법에 비해 쉽고 편리하다는 것을 알게 될 것입니다. 그러나 수동 방법도 마찬가지로 잘 작동합니다. 그러나 여기 저기 코드로 조금 더 작업해야 합니다.

어떤 방법이 쉬웠나요? 의견에 알려주십시오.