내 사이트에 카카오톡 채널 1:1 채팅 버튼(구.플러스친구)을 추가할 수 있습니다. 이 도움말에서는 사용자가 직접 디자인한 버튼 이미지를 사용해 카카오톡 채널 채팅 버튼을 추가하는 방법을 설명합니다.
참고 : 카카오에서 공식 제공하는 채팅 버튼 이미지를 사용하려는 경우, 카카오톡 채널 1:1 채팅 버튼 추가하기 도움말을 확인해 주세요.
샘플 카카오톡 채널 버튼 이미지를 내려받을 수 있습니다. 내려받은 파일은 압축을 풀어 이용해 주세요.
파일크기 및 형식 : 20KB, ZIP 압축
파일 구성 : PSD, PNG
카카오톡 채널 채팅 버튼을 사용하려면, 카카오 API키가 필요합니다. 아래 도움말 링크를 참고해 카카오 API키를 발급받고 사이트에 적용해 주세요.
참고 : 기존 사용 중인 카카오 API키가 있는 경우, 이 과정은 건너 뛰어도 됩니다.
사용 중인 카카오톡 채널의 홈 ID를 확인하고 메모합니다.
카카오톡채널 관리자센터에 접속합니다.
내 채널을 선택합니다. (채널이 없는 경우 새로운 채널을 생성해 주세요.)
왼쪽의 [관리 > 상세설정] 메뉴를 클릭합니다.
채널 홈ID를 확인하고 메모장에 메모해 둡니다. (메모해 둔 홈ID는 아래 6단계에서 사용됩니다.)
아래의 카카오톡 채널 커스텀 채팅 버튼 코드 전체를 복사합니다.
새 브라우저 탭을 열고, 관리자 페이지에 접속합니다.
왼쪽 메뉴에서 [환경설정 > SEO 헤더설정]을 클릭합니다.
페이지 하단의 Footer Code 입력 칸에 위 3단계에서 복사한 코드를 붙여넣습니다.
붙여넣은 코드의 JavaScript키를 삭제합니다.
위 1단계에서 발급받은 JavaScript키를 붙여넣습니다.
코드에서 홈ID를 삭제합니다.
위 2단계에서 메모해 둔 홈ID를 붙여넣습니다.
코드에서 이미지주소를 삭제합니다.
카카오톡 채널 채팅 버튼으로 사용할 이미지의 주소(http 또는 https로 시작하는)를 입력합니다. (PC용과 모바일용 버튼 이미지를 함께 쓰거나, 따로따로 사용할 수도 있습니다.)
참고: 채팅 버튼으로 사용할 이미지의 주소를 획득하는 방법은 빠른 이미지 주소 획득 방법 도움말을 참고해 주세요.
(선택 사항) width 와 height 속성의 숫자를 변경해, 버튼 이미지의 크기를 수정할 수 있습니다. (숫자만 변경하세요.)
주석을 참고해 PC와 모바일 카카오톡 채널 버튼 이미지의 위치를 각각 수정합니다.
저장 버튼을 클릭해 적용합니다.
관리자 페이지 왼쪽 상단의 미리보기 아이콘을 클릭합니다.
상담하기 버튼을 클릭해 작동여부를 확인합니다.
참고 : 스마트폰으로 내 사이트에 접속해 작동여부를 확인할 수도 있습니다.
모두 정상적으로 적용 완료했는데, 카카오톡 채널 채팅이 시작되지 않는 경우, 아래 그림과 같이 1:1 채팅 사용을 위해 관리자 추가인증 작업이 필요할 수 있습니다. 아래 절차를 참고해 인증을 완료해 주세요.
카카오톡채널 관리자센터 접속 후 왼쪽 메뉴에서[1:1 채팅 > 채팅목록]을 클릭합니다.
관리자 추가인증 버튼을 클릭합니다.
카카오톡으로 전달 받은 인증번호를 입력해 관리자 추가인증을 완료합니다.