해피톡 도움말 : Happybook
  • 📘해피북
  • 회원가입
  • 서비스설정(관리자)
    • 대시보드
    • 기본 설정
      • 기본 조건 설정
      • 상담 분류 관리
      • 채팅 버튼 설정
      • 채팅 버튼 설정 v2
      • 채팅 버튼 v2 설치 가이드
        • Javascript SDK
        • Basic Sample
        • 채팅 부가 옵션
        • SDK에서 제공하는 함수
        • Event Handler
        • 모바일 웹뷰 설정
    • 상담 운영
      • 휴무일/근무 관리
      • 공지사항 관리
      • 헬프데스크 설정
    • 고급 설정
      • 상담 배분 관리
      • 템플릿 관리
      • 자동 메시지 관리
      • 상담정보 관리
      • 자동완성 관리
      • 파라미터 관리
      • 금지어 관리
      • 태그 관리
      • 인증 관리
    • 확장 서비스 관리
      • 서비스 연동 관리 : 채널 연동
      • 서비스 연동 관리 : 커머스 연동
      • 카페24 : 쇼핑몰 주문정보 연동
      • 카페24 : 반품 택배 자동 접수
    • 챗봇
      • 🤖해피봇New 도움말
      • 챗봇 만들기
      • 챗봇 설정
      • 프로필봇 설정
    • 고객 관리✨
      • 고객 등급 관리
      • 차단 고객 관리
      • 메시지 발송 💌
      • 메시지 발송(카페24, 메이크샵)
      • 태스크 플로우✨
    • 계정&시스템 관리
      • 계정 관리
      • 서비스 관리
      • 서비스 이용내역
      • 보안 설정
  • 상담관리(매니저)
    • 대시보드
    • 실시간 모니터링
    • 챗봇 상담 현황
    • 채팅 상담 현황
    • 상담원 요청사항
    • Reporting
      • Monthly
      • Daily
      • Reporting
      • 챗봇 시나리오 고객여정
      • 상담품질지표(SQI)
      • 상담 내역
  • 채팅(상담사)
    • 상담 환경설정
    • 채팅상담 목록
    • 현재상담 영역
    • 상담정보 영역
    • 템플릿&자동완성
  • 해피톡 바로가기
    • 해피톡 홈페이지
    • 해피톡 블로그
    • 서비스 이용약관
    • 개인정보 처리방침
Powered by GitBook
On this page
  1. 서비스설정(관리자)
  2. 기본 설정

채팅 버튼 설정

각 채널별 채팅 버튼 소스와 채팅 URL을 제공합니다.

Previous상담 분류 관리Next채팅 버튼 설정 v2

Last updated 1 year ago

웹채팅v1 채팅 버튼으로 사용할 경우 적용할 버튼 스크립트를 확인하고, 각 채널별 채팅 URL을 복사할 수 있어요. 채널별로 실제 고객 입장에서 채팅 테스트를 할 수 있습니다. 버튼 이미지나 위치 등을 바꾸려면 매번 소스 코드를 수정해야 하는 번거로움이 있어요. 웹채팅v1 버전으로 사용하는 경우가 아니라면 실제 홈페이지에 채팅 버튼을 설치할 때는, 메뉴를 참고해 주세요. 😊

  • 카카오톡, 네이버톡톡 : 채널 아이디 선택 후 소스보기를 하면, 하단에서 채팅 버튼 소스를 확인할 수 있습니다. 해당 소스 그대로 홈페이지에 삽입 시 </body> 위쪽에 넣어주세요. 그대로 적용 시에는 왼쪽 하단에 고정되어 설치됩니다. 버튼 위치나 이미지를 수정하고자 할 경우, 아래와 같이 소스 내에서 수정해 주셔야 해요.

<div style="position:fixed;z-index:9001;bottom:70px;right:50px;">
<a href="채팅URL" target="_blank">
<img style="width:70px;height:70px;" src="//happytalk.io/assets/main/img/btn-chat-kakao.png">
</a></div>

**해피톡(웹채팅)**은 카카오톡 채널, 네이버톡톡처럼 메신저에 연동하여 상담을 하는 것이 아닌, 채팅 버튼이나 URL을 통해 인입 시 바로 상담을 진행할 수 있는 해피톡에서 제공하는 채팅을 의미합니다. 이 웹채팅은 2가지 버전으로 구분되는데요. 이제 2가지 버전의 차이를 안내드리겠습니다.

  • **해피톡(웹채팅) v1 **: 고객이 채팅 버튼을 클릭하면 새 창이 열려 채팅상담을 진행할 수 있습니다.

  • **해피톡(웹채팅) v2 **: 고객이 채팅 버튼을 클릭하면 열려 있는 페이지에서 바로 채팅상담을 시작할 수 있습니다. v2 버전은 해피톡 채팅 버튼을 설치할 사이트에 한 번만 소스 코드를 삽입해 두면 이후부터 해피톡에서 바로 디자인을 바꿀 수 있습니다. 버튼은 물론 채팅 화면 디자인도 우리 회사에 맞춰 꾸밀 수 있고, 제공되는 기능도 더욱 다양하오니, **가급적 v2 버전을 활용하시는 것을 권해드립니다. **😉

bottom과 right 값이 커질수록 아래, 오른쪽에서 멀어집니다. 채팅 URL은 각 채널별 채팅 버튼 소스에서 '채팅창url복사' 시 확인할 수 있어요. 버튼 이미지는 img style의 width(너비), height(높이)로 수정할 수 있습니다. 적용된 이미지는 img src=뒤에서 변경해주시면 돼요. 아래 url은 해피톡에서 제공하는 각 채널별 기본 이미지 주소입니다. 카카오) 웹채팅) 네이버)

웹채팅v1에서는 바로 채팅창이 아닌, 고객이 상담방 생성 전에 상담 분류를 먼저 선택 후 인입하도록 사용할 수 있습니다. (7-2-2. 이미지에서 채팅 시작 경로를 채팅창이 아닌, 상담목록으로 선택 후 적용된 스크립트로 적용해주시면 돼요.) 자세한 내용은 를 참고해 주세요.

웹채팅v2 채팅 URL은 [채팅 버튼 설정] > 해피톡v2/통합채팅에서 '채팅창url복사' 해주시면 됩니다. 에서 오른쪽 상단의 **'적용하기'**를 한 번 눌러 주셔야 고객 입장에서 채팅 테스트를 할 수 있습니다.

//happytalk.io/assets/main/img/btn-chat-kakao.png
//happytalk.io/assets/main/img/btn-chat.png
//happytalk.io/assets/main/img/btn-chat-navertt.png
상담 분류 관리
[서비스설정] > [기본 설정] > [채팅 버튼 설정 v2]
채팅 버튼 설정 v2
7-1. 채팅 버튼 설정
7-2-1. 웹채팅v1 버전 활용 예시
7-2-2. 웹채팅v1 소스 확인하기
7-3-1. 웹채팅v2 버전 채팅 버튼
7-3-2. 웹채팅v2 버전 활용 예시
7-4-1. 웹채팅v2 채팅 URL 복사하기
7-4-2. 웹채팅v2 채팅 URL 접속 화면