1. 카카오링크를 사용할 홈페이지를 등록한다


https://developers.kakao.com/apps/new 에서

1) 앱의 설정 - 일반에서 플랫폼 추가를 선택합니다.
2) 웹 플랫폼을 선택하고, 사이트 도메인을 등록합니다. (예: http://www.mhomepage.com)
3) 페이지 상단의 Javascript 키 항목을 외우거나, 복사해 둡니다.

2. 문서에 다음 스크립트를 삽입한다
<script src="https://developers.kakao.com/sdk/js/kakao.min.js"></script>

 

3. 등록된  Javascript 키를 설정해 주세요.

<script>Kakao.init('YOUR APP KEY');</script>

 

4. 웹버튼 생성하기

<a id="kakao-link-btn" href="javascript:;">
<img src="http://dn.api1.kage.kakao.co.kr/14/dn/btqa9B90G1b/GESkkYjKCwJdYOkLvIBKZ0/o.jpg" />
</a>

<script>
Kakao.Link.createTalkLinkButton({
  container: '#kakao-link-btn',
  label: "메시지 / 링크주소",
  image: {
      src: 'http://www.mhomepage.com/img/t_logo.gif',
      width: '300',
      height: '80'
  },
  webButton: {
    text: 'M홈페이지',
    url: 'www.mhomepage.com'  //등록한 사이트주소여야함
  }
});
</script>

 

5. 동적으로 바뀌는 내용 전송하기

    <a id="kakao-link-btn" href="javascript:sendLink()">
      <img src="http://dn.api1.kage.kakao.co.kr/14/dn/btqa9B90G1b/GESkkYjKCwJdYOkLvIBKZ0/o.jpg" />
    </a>

    <script>
     function sendLink() {
      Kakao.Link.sendTalkLink({
        label: '안녕하세요, 꽃다운 ' + Math.floor(Math.random()*(70)+ 15) + '살 개발자입니다.',

        webLink: {

            text:'앱이름',

url:'www.mhomepage.com'

        }
      });
    }
    </script>

[주의사항]

1) webButton, webLink 적용시 url은 등록한 사이트 주소여야 합니다. webButton과 webLink의 차이는 아이콘이 있고 없고입니다.

2) label에 사이트 주소를 입력하면 링크 이동이 가능합니다.

3) 개발자 사이트: https://developers.kakao.com/docs/js

 

출처: http://www.ithinknext.com/response/board/skin/basic/view.php?tbname=tb69092&no=3

+ Recent posts