The Chat Quotient Logo The Chat Quotient
무료 도구

웹 사이트용 WhatsApp 채팅 위젯 빌드

아래에서 구성하고 이 페이지에서 직접 시도해 보세요. 모서리의 거품이 실제 위젯이고, 실시간입니다.

위젯 구성

변경 사항은 라이브 미리 보기 및 스니펫을 즉시 업데이트합니다.

코드가 올바르도록 국가를 선택하세요(WhatsApp은 없으면 채팅을 찾을 수 없음). 그런 다음 나머지 번호를 입력하고 숫자만 입력하세요.

쿠키 배너나 다른 채팅 도구와 같은 사이트의 다른 요소 뒤에 위젯이 숨겨져 있으면 이를 늘립니다.

임베드 스니펫

웹 사이트의 닫는 </body> 태그 앞에 붙여넣습니다.

라이브 미리 보기

이 페이지의 아래쪽 모서리를 보세요. 그것이 당신의 위젯이며, 위의 설정에서 실제 임베드 스크립트를 사용하여 렌더링됩니다.

WhatsApp Web에서 리드 관리

무료 Chat Quotient Chrome 확장 프로그램을 다운로드하여 WhatsApp Web 내에서 모든 대화를 보고 관리합니다. 완전한 WhatsApp CRM 경험입니다.

Chrome에 추가, 무료입니다

WhatsApp 채팅 위젯이란?

WhatsApp 채팅 위젯은 웹 사이트의 모서리에 있는 작은 버튼으로, 클릭하면 비즈니스와의 WhatsApp 대화가 열립니다. 비즈니스의 WhatsApp 번호로 직접 이동하거나 먼저 짧은 양식을 통해 이동합니다. 정적인 "문의" 링크 또는 이메일 양식을 방문자가 이미 휴대폰에서 열어두고 있는 채널로 바꿉니다.

간단한 클릭해서 채팅 링크(wa.me를 열기만 하는 텍스트 또는 아이콘)와는 다릅니다. 위젯은 구성 가능합니다. 위치, 색상 및 사전 채워진 인사말입니다.

웹 사이트에 WhatsApp 채팅 위젯을 추가하는 방법

  1. 1

    위젯 구성

    WhatsApp 번호를 입력한 다음 위젯의 색상과 모서리를 선택합니다.

  2. 2

    스니펫 복사

    위의 "스니펫 복사" 버튼을 사용합니다. 다른 파일이나 종속성이 없는 단일 <script> 태그입니다.

  3. 3

    사이트에 붙여넣기

    사이트의 HTML 닫는 </body> 태그 바로 앞에 추가하세요.

  4. 4

    게시

    그게 다야. 위젯은 스니펫에서 자신을 렌더링합니다. 빌드 단계, 백엔드 또는 계정이 필요하지 않습니다.

플랫폼별 붙여넣기 위치

WordPress
"Insert Headers and Footers" 또는 "WPCode" 같은 플러그인을 사용하거나 Appearance → Theme File Editor를 통해 테마의 footer.php에 </body> 앞에 직접 붙여넣습니다.
Shopify
Online Store → Themes → Edit code → theme.liquid, 스니펫을 </body> 바로 위에 붙여넣습니다.
Wix
Settings → Custom Code → Add Code, "Body - end" 섹션의 모든 페이지에 로드되도록 설정합니다.
Webflow
Project Settings → Custom Code → Footer Code, 그런 다음 사이트를 게시합니다.
다른 모든 사이트
사이트의 HTML을 편집할 수 있다면 </body> 앞에 붙여넣습니다. 어디서나 동일하게 작동합니다.

웹 사이트에 WhatsApp 버튼을 추가하는 이유

양식 없음, 이메일 없음, 페이지 새로 고침 없음

방문자는 연락처 양식에 입력하고 답변을 기다리는 대신 이미 휴대폰에 열려 있는 앱에서 귀사에 연락합니다.

방문자가 이미 있는 곳에서 만남

WhatsApp은 전 세계 수십억 명의 기본 메시징 앱입니다. 대부분의 방문자에게는 다운로드하거나 등록할 새로운 것이 없습니다.

모든 채팅이 맥락으로 시작됨

미리 채워진 인사말은 대화가 차가운 시작이 아니라는 의미입니다. 방문자는 메시지가 이미 틀에 맞춰진 상태로 WhatsApp에 도착합니다.

어디에 앉을지 정확히 제어할 수 있습니다

색상, 모서리 및 오프셋을 설정하여 위젯이 일반적인 기본 거품 대신 사이트와 일치하도록 합니다.

승인 프로세스 없이 무료

WhatsApp Business API 신청 없음, 별도 번호 없음, 단일 스크립트 태그 이상의 코드 없음.

채팅 버튼 vs 채팅 위젯. 차이점은?

채팅 버튼

클릭하면 WhatsApp 채팅이 열리는 정적 링크 또는 아이콘. 대상 번호 이상의 구성이 없습니다.

채팅 위젯

  • 구성 가능한 색상, 위치 및 사전 채워진 인사말
  • 어디서나 작동: WordPress, Shopify, Wix, Webflow 또는 순수 HTML, 종속성 없음
  • 이것이 정확히 위에서 빌드하는 것입니다

자주 묻는 질문

이 WhatsApp 채팅 위젯 생성기는 무료인가요? +

네. 위에서 빌드하는 리디렉션 위젯(번호, 색상, 위치 및 인사말)은 무료이며 작은 "Powered by Chat Quotient" 배지가 있습니다. AI 에이전트 구동 Pro 버전이 향후에 계획되어 있습니다.

이를 사용하려면 WhatsApp Business API가 필요한가요? +

아니요. 위젯은 기존 WhatsApp 번호를 사용하여 일반 WhatsApp 채팅을 엽니다. Business API 승인 또는 별도 번호가 필요하지 않습니다.

WordPress, Shopify, Wix 또는 다른 웹 사이트에서 작동하나요? +

네. 종속성이 없는 단일 <script> 태그이므로 HTML을 붙여넣을 수 있는 모든 곳에서 작동합니다. WordPress, Shopify, Wix, Webflow, Squarespace 또는 수동으로 구축된 사이트입니다.

위젯이 내 웹 사이트를 느리게 하나요? +

눈에 띄지 않아야 합니다. 스크립트는 작고 async 및 defer로 로드되므로 페이지를 차단하지 않으며 격리된 Shadow DOM 내에서 렌더링되므로 사이트 스타일과 충돌하지 않습니다.

WhatsApp으로 이동하기 전에 방문자의 이름을 캡처할 수 있나요? +

아직 아닙니다. WhatsApp 전환 전 리드 캡처는 로드맵에 있으며, 준비되면 여기서 토글을 다시 활성화합니다.

내 구성은 어디에 저장되나요? +

우리 서버의 어디에도 없습니다. 설정은 사이트에 붙여넣는 스크립트 태그 내에 존재합니다. 나중에 뭔가 변경하려면 이 페이지로 돌아가서 재구성하고 새 스니펫을 복사하세요(현재 스니펫 사본을 보관하세요. 우리는 당신을 위해 보관하지 않습니다).

채팅 버튼과 채팅 위젯의 차이점은? +

"채팅 버튼"은 일반적으로 WhatsApp을 여는 정적 링크입니다. "채팅 위젯"(이 도구가 구축하는 것)은 구성 가능한 인사말, 위치 및 색상이 있는 떠 있는 런처입니다.

개인 WhatsApp 번호를 사용할 수 있습니까, 아니면 사업 번호가 필요합니까? +

모든 WhatsApp 번호가 작동합니다. 개인 또는 비즈니스입니다. 국가 코드와 함께 입력하기만 하면 공간이나 더하기 기호가 없습니다.