문의 사항에 따라 필요한 정보를 먼저 입력하시면 더 빠르게 대응해 드릴 수 있습니다.
기존에 위의 앱으로 카카오채팅을 서비스 URL에 설치하여 사용하여 왔습니다. 이번에 카카오씽크를 통해서 카카오로 로긴하기 기능을 사용하기 위해서 카페24에서 카카오씽크를 사용하기 시작 하였습니다. 그러나 기존에 카카오채팅을 위한 코드( 카카오 디벨로퍼스> 도구 > 소셜플러그인 > 채팅하기 에서 생성된 코드 )를 서비스 URL 의 Body사이에 넣어 둔 것과 새로이 사용하기 시작한 카카오씽크의 카카오로 로그인 하기가 충돌 하는 것을 발견 하였습니다.
Body 에 있는 기존 코드를 삭제하면 카카오 채팅을 사용 할 수 없게 되는 대신에 카카오로 로그인 기능은 동작하고, 코드를 그대로 두면 채팅은 사용이 가능하지만 카카오로 로그인 하기가 사용불능이 됩니다. 카카오로 로그인하기를 누르면 채팅 아이콘이 사라지기도 합니다.
어떻게 하면 카카오 채팅과 카카오로 로그인 하기 모두 사용이 가능한지 문의 드립니다. 동시에 로그인 화면뿐 아니라 상품상세페이지도 카카오로 로그인하기 버튼을 넣고 싶은데 이것은 어떻게 해야 하는지도 문의 드립니다.
감사합니다
안녕하세요.
어떤 충돌인지 좀 더 구체적으로 설명 부탁드립니다. (오류 로그 등)
1. 우선, 채팅하기를 위해 삽입된 코드는 제거하시고, 아래 코드를 사용 부탁드립니다. <script type="text/javascript" src="//t1.kakaocdn.net/kakao_js_sdk/v1/kakao.min.js" charset="utf-8"></script> 태그 보다 아래에 위치해야 합니다.
<script>
if(!Kakao.isInitialized()) {
Kakao.init('e618a3aae4a6a45bbc1b05264215a1d0');
}
Kakao.Channel.createChatButton({
container: '#kakao-talk-channel-chat-button',
});
</script>
2. 카카오 로그인 버튼은 아래 코드를 참고 부탁드립니다.
<a href="#none" onclick="MemberAction.kakaosyncLogin('e618a3aae4a6a45bbc1b05264215a1d0')"><img src="//img.echosting.cafe24.com/skin/base_ko_KR/member/btn_kakao_login.gif" alt="카카오계정 로그인"></a>
이 코드는 카페24에서 카카오 로그인 사용을 위해 제공되는 코드 입니다.
다른이야기지만, 개인적으로 상품페이지 내 카카오 로그인 버튼이 있는게 이상해 보이는데요
안녕하세요
Body 사이에 기존에 있던 카카오 채팅용 코드를 삭제하고 1번에서 주신 코드를 넣었습니다. 결과는 카카오로그인은 되지만 카카오채팅 아이콘들이 모두 사라졌습니다. 즉 카카오채팅을 사용 할 수 없게 되었습니다.
혹시 1번에 주신 코드를 기존에 있던 카카오채팅용 코드와 같이 사용해야 했던 건가요?
감사합니다
woody.ho:
→ 요 코드는 현재 저희 사이트에 사용되지 않고 있는 듯 합니다. 사용 되어야 하는 코드 일가요?
<script>
$(function() {
if(!Kakao.isInitialized()) {
Kakao.init('e618a3aae4a6a45bbc1b05264215a1d0');
}
Kakao.Channel.createChatButton({
container: '#kakao-talk-channel-chat-button',
});
})
</script>
위와같이 변경해보시겠어요?
안녕하세요~~
주신 코드로 PC와 모바일 모두 기존 카카오채팅 코드를 대체 하였습니다.
PC의 경우 채팅과 카카오로그인이 지금까지 잘 되고 있습니다
모바일의 경우 카카오로그인은 진행 되는데, 카카오채팅 아이콘이 사라졌습니다
모바일의 경우 어떻게 해야 둘다 사용이 가능할가요?
감사합니다
안녕하세요~~
모바일쪽은 카카오채팅이 안 나오는데 어떻게 수정을 해야 할지 문의 드립니다.
감사합니다.
앞서 안내드린 채널 추가 스크립트는
사이트의 스크립트 로드 순서가 PC일때와 모바일일때 서로 다릅니다.
추가로 사이트 구성에 여러 오류와 경고 메시지가 확인됩니다.
위에 주신 스크립트는 이번에 문의 드린 사이트가 아닌 다른 사이트에도 같은 스크립트를 사용하면 모두 카카오로그인과 카카오채팅을 사용 가능한 것인가요? 아니면 서비스 URL 마다 다른 스크립트가 필요 한 것인가요?
감사합니다
안녕하세요
카페24에 확인해 보니. Jquery는 내장되어 자동 로드 된다고 합니다. 그럼에도 woody 님이 확인하셨을때 저희 모바일 쇼핑몰에 Jquery 가 미리 로드 되어 있지 않았다는 것인지 문의 드립니다.
바쁘신데 지원해 주셔서 감사드립니다
jquery 내장되어 있는 것을 확인하였습니다.
다만, 스크립트는 위에서 아래로 선언된 순서대로 실행됩니다.$ 함수가 실행되지 않습니다.
동일한 이유로 안내된 스크립트가 kakao.min.js 로드 보다 뒤에 사용된다면 jquery 함수인 $(function() { ... })로 채팅 스크립트를 감쌀 필요가 없습니다.
때문에 컨텐츠를 우선 정리하시고 순서를 맞추어 채팅 스크립트를 삽입 하셔야 합니다.
정리하시는데 어려움을 격고 계신다면 아래 스크립트로 변경 부탁드리며,
document.addEventListener('DOMContentLoaded', function () {
if(!Kakao.isInitialized()) {
Kakao.init('e618a3aae4a6a45bbc1b05264215a1d0');
}
Kakao.Channel.createChatButton({
container: '#kakao-talk-channel-chat-button',
});
});
Woody 님
새로 주신 코드를 모바일 쇼핑몰 body 영역에 코드를 넣었습니다. 직접 HTML을 수정하여 넣은 것이 아니고 카페24에서 SEO 작업을 위해서 코드를 직접 입력 할 수 있는 영역( HEAD 와 BODY 영역 )중에 Body 영역에 넣었습니다.
결과는 카카오로 로그인은 계속 되지만 채팅 아이콘은 아직 나타나지 않고 있습니다. 도움 요청 드립니다
아래의 코드를 같은 body 영역에 넣었을 경우에는 카카오로그인은 안되지만 채팅은 가능했었습니다. 참고위해 아래 공유 드립니다 ( 스크립트 코드가 저장을 하면 안 보이네요 …어떻게 코드를 공유해 드려야할지 모르겠네요 )
좋은 소식이 있습니다. 카카오로그인 기능을 넣었더니 여러분이 벌써 사용을 하시네요. 감사합니다. 헌데 카카오 상담채팅 기능이 비활성화 되어서 고객들이 뭐라 하시네요… 이 부분도 모바일 쇼핑몰에서 살릴 방법이 없을가요? ㅜㅜ
→ 제가 스크립트 넣을때 실수를 했네요 ^^;; 이제 잘 동작 합니다 ~~ 지원해 주셔서 감사합니다
감사합니다
1개의 좋아요
