테스트 사이트 - 개발 중인 베타 버전입니다
SIR
목록으로
이전글 다음글

카카오링크 사용법 채택완료

퍼지 11년 전 조회 17,204
답변 4
목록
카톡링크 사용법이 궁금합니다

3.5



사이트 가서 뭔 등록하고 자바스 코드 받아서

관리자모드서 입력만 하면 끝인가요?

그래 해도 모바일에서 글 보기의 하단에 카가오버튼 터치해도 글과 링크를 넘기지 않고

그냥 카톡이 열리기만 하네요

그냥 카톡 앱 터치해서 열리듯

#그누보드5
댓글을 작성하려면 로그인이 필요합니다.

답변 4개

채택된 답변
+20 포인트
닉

https://developers.kakao.com/docs/js#카카오톡-링크">https://developers.kakao.com/docs/js#카카오톡-링크

 

</p><p><span class="hljs-doctype"><!doctype HTML></span>
<span class="hljs-tag"><<span class="hljs-title">html</span>></span>
  <span class="hljs-tag"><<span class="hljs-title">head</span>></span>
    <span class="hljs-tag"><<span class="hljs-title">meta</span> <span class="hljs-attribute">charset</span>=<span class="hljs-value">"utf-8"</span>></span>
    <span class="hljs-tag"><<span class="hljs-title">meta</span> <span class="hljs-attribute">http-equiv</span>=<span class="hljs-value">"X-UA-Compatible"</span> <span class="hljs-attribute">content</span>=<span class="hljs-value">"IE=edge"</span> /></span>
    <span class="hljs-tag"><<span class="hljs-title">title</span>></span>KakaoLink Demo(Web Button) - Kakao Javascript SDK<span class="hljs-tag"></<span class="hljs-title">title</span>></span>
    <span class="hljs-tag"><<span class="hljs-title">script</span> <span class="hljs-attribute">src</span>=<span class="hljs-value">"<a href="https://developers.kakao.com/sdk/js/kakao.min.js" target="_blank" rel="noopener noreferrer">https://developers.kakao.com/sdk/js/kakao.min.js</a>"</span>></span><span class="javascript"></span><span class="hljs-tag"></<span class="hljs-title">script</span>></span>
  <span class="hljs-tag"></<span class="hljs-title">head</span>></span>
  <span class="hljs-tag"><<span class="hljs-title">body</span>></span>
    <span class="hljs-tag"><<span class="hljs-title">h3</span>></span>카카오톡 링크는 카카오톡 앱이 설치되어 있는 모바일 기기에서만 전송 가능합니다.<span class="hljs-tag"></<span class="hljs-title">h3</span>></span>
    <span class="hljs-tag"><<span class="hljs-title">a</span> <span class="hljs-attribute">id</span>=<span class="hljs-value">"kakao-link-btn"</span> <span class="hljs-attribute">href</span>=<span class="hljs-value">"javascript:;"</span>></span>
      <span class="hljs-tag"><<span class="hljs-title">img</span> <span class="hljs-attribute">src</span>=<span class="hljs-value">"<a href="<a href="http://dn.api1.kage.kakao.co.kr/14/dn/btqa9B90G1b/GESkkYjKCwJdYOkLvIBKZ0/o.jpg" target="_blank" rel="noopener noreferrer">http://dn.api1.kage.kakao.co.kr/14/dn/btqa9B90G1b/GESkkYjKCwJdYOkLvIBKZ0/o.jpg</a>"><a href="http://dn.api1.kage.kakao.co.kr/14/dn/btqa9B90G1b/GESkkYjKCwJdYOkLvIBKZ0/o.jpg" target="_blank" rel="noopener noreferrer">http://dn.api1.kage.kakao.co.kr/14/dn/btqa9B90G1b/GESkkYjKCwJdYOkLvIBKZ0/o.jpg</a></a>"</span> /></span>
    <span class="hljs-tag"></<span class="hljs-title">a</span>></span>

    <span class="hljs-tag"><<span class="hljs-title">script</span>></span><span class="javascript">
    <span class="hljs-comment">// 사용할 앱의 Javascript 키를 설정해 주세요.</span>
    Kakao.init(<span class="hljs-string">'YOUR APP KEY'</span>);

    <span class="hljs-comment">// 카카오톡 링크 버튼을 생성합니다. 처음 한번만 호출하면 됩니다.</span>
    Kakao.Link.createTalkLinkButton({
      container: <span class="hljs-string">'#kakao-link-btn'</span>,
      label: <span class="hljs-string">'카카오링크 샘플에 오신 것을 환영합니다.'</span>,
      image: {
        src: <span class="hljs-string">'<a href="<a href="http://dn.api1.kage.kakao.co.kr/14/dn/btqaWmFftyx/tBbQPH764Maw2R6IBhXd6K/o.jpg" target="_blank" rel="noopener noreferrer">http://dn.api1.kage.kakao.co.kr/14/dn/btqaWmFftyx/tBbQPH764Maw2R6IBhXd6K/o.jpg</a>"><a href="http://dn.api1.kage.kakao.co.kr/14/dn/btqaWmFftyx/tBbQPH764Maw2R6IBhXd6K/o.jpg" target="_blank" rel="noopener noreferrer">http://dn.api1.kage.kakao.co.kr/14/dn/btqaWmFftyx/tBbQPH764Maw2R6IBhXd6K/o.jpg</a></a>'</span>,
        width: <span class="hljs-string">'300'</span>,
        height: <span class="hljs-string">'200'</span>
      },
      webButton: {
        text: <span class="hljs-string">'카카오 디벨로퍼스'</span>,
        url: <span class="hljs-string">'<a href="https://dev.kakao.com/docs/js'" target="_blank" rel="noopener noreferrer">https://dev.kakao.com/docs/js'</a></span> <span class="hljs-comment">// 앱 설정의 웹 플랫폼에 등록한 도메인의 URL이어야 합니다.</span>
      }
    });
    </span><span class="hljs-tag"></<span class="hljs-title">script</span>></span>
  <span class="hljs-tag"></<span class="hljs-title">body</span>></span>
<span class="hljs-tag"></<span class="hljs-title">html</span>></span></p><p>

 

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

새
새땅
8년 전

잘 적용되었습니다. 감사합니다~ 그리고 저는 그누보드4인데~ 게시판에 적용시켰습니다.  설정의 웹 플랫폼에 등록한 도메인에 링크되는게 아니고 게시판 현재페이지로 연동되려면 어떻게 적용시켜야 하는지요?

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

닉

카톡 링크 연동 하시면

정상적으로 됬을때는....

해당 버튼 클릭하면 카카오톡 앱이 일단 열리구요

그 다음 친구 선택 창이 나타난답니다.

친구 선택을 완료하면 해당 친구에게 (혹은 친구들에게) 메시지가 전송되는 형태입니다.

 

개발자 등록하시고, 앱 생성하신다음에 API 키 받으시고... SDK 보고 작업하시면 될 것 같습니다

 

행운을 빕니다~~ 

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

홈

사용법 리뉴얼보시면 쉽게 찾아볼수있어요.

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인