심재운 블로그

반응형

 

자바스크립트  카카오톡 KAKAOTALK 공유하기 SHARE

 

social 의 속성을 이용하여 좋아요, 댓글,공유개수 까지 공유할 수 있다.

제외하면 단지 제목과 설명 정도만 카카오톡에 공유한다.

 

<a id="kakao-link-btn" href="javascript:void(0);" class="consume-test-share-btn"><img src="../../content/images/morebuysocial/test-share-kakaostory-icon.png" alt="카카오스토리 공유 아이콘"></a>

 

// // 사용할 앱의 JavaScript 키를 설정해 주세요.
Kakao.init('856241xxxxxxxxxxxxxxxx1f76');
// // 카카오링크 버튼을 생성합니다. 처음 한번만 호출하면 됩니다.
Kakao.Link.createDefaultButton({
    container: '#kakao-link-btn',
    objectType: 'feed',
    content: {
        title: $('meta[property="og:title"]').attr('content'),
        description: $('meta[property="og:description"]').attr('content'),
        imageUrl: $('meta[property="og:image"]').attr('content'),
        link: {
            mobileWebUrl: window.location.href,
            webUrl: window.location.href
        }
    },
    social: {
        likeCount: 286,
        commentCount: 45,
        sharedCount: 845
    },
    buttons: [
        {
            title: '웹으로 보기',
            link: {
                webUrl: window.location.href
            }
        }
    ]
});

 

 

참고 사이트

 

https://kmkblog.tistory.com/489

 

카카오톡 앱으로 링크 공유하기 스크립트, 링크 공유 시 앱으로 연결

아무 생각 없이 티스토리 블로그를 하다보니까 최근에 와서야 카카오톡 공유하기 기능이 앱에서는 웹으로 연결된다는 사실을 알게 되었습니다. 이렇게 되면 스마트폰 웹 브라우저에 별도 로그

kmkblog.tistory.com

 

 

카카오링크 보내기

<a id="create-kakao-link-btn" href="javascript:;">
  <img
    src="https://developers.kakao.com/assets/img/about/logos/kakaolink/kakaolink_btn_medium.png"
  />
</a>
<script type="text/javascript">

  Kakao.init('856241xxxxxxxxxxxxxxxx1f76');
  
  Kakao.Link.createDefaultButton({
    container: '#create-kakao-link-btn',
    objectType: 'feed',
    content: {
      title: '딸기 치즈 케익',
      description: '#케익 #딸기 #삼평동 #카페 #분위기 #소개팅',
      imageUrl:
        'http://k.kakaocdn.net/dn/Q2iNx/btqgeRgV54P/VLdBs9cvyn8BJXB3o7N8UK/kakaolink40_original.png',
      link: {
        mobileWebUrl: 'https://developers.kakao.com',
        webUrl: 'https://developers.kakao.com',
      },
    },
    social: {
      likeCount: 286,
      commentCount: 45,
      sharedCount: 845,
    },
    buttons: [
      {
        title: '웹으로 보기',
        link: {
          mobileWebUrl: 'https://developers.kakao.com',
          webUrl: 'https://developers.kakao.com',
        },
      },
      {
        title: '앱으로 보기',
        link: {
          mobileWebUrl: 'https://developers.kakao.com',
          webUrl: 'https://developers.kakao.com',
        },
      },
    ],
  })
</script>

 

https://developers.kakao.com/tool/demo/message/kakaolink

 

Kakao Developers

카카오 API를 활용하여 다양한 어플리케이션을 개발해보세요. 카카오 로그인, 메시지 보내기, 친구 API, 인공지능 API 등을 제공합니다.

developers.kakao.com

 

 

반응형

댓글

비밀글모드