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

  Kakao.init('나의 앱 키');

	//기본 버튼 공유하기
	Kakao.Link.createDefaultButton({

    /* 버튼을 먹일 곳*/
		container : '#kakao-link-btn',

    /* 여기서 타입은 feed로 고정 */
		objectType: 'feed',

    /* 카드형 안에 들어갈 내용들 */
    content: {

      /* 당연히 제목 */
      title: '바나나!!!~~~~~',

      /* 당연히 설명 */
      description: '#내가 #테스트 #하는 #거야',

      /* 사진 주소 */
      imageUrl: 'https://images2.alphacoders.com/507/thumb-1920-507980.png',

      /* 사진을 눌렀을 때 이동 페이지(다르게 줄 수 있음) */
      link: {
        mobileWebUrl: 'https://developers.kakao.com',
        webUrl: 'https://seonhyungjo.github.io/'
      }
    },
    /* 각종(좋아요, 댓글수, 공유수, 열어본수, 구독수) */
    social: {
      likeCount: 1,
      commentCount: 2,
      sharedCount: 3,
      viewCount : 10000,
      subscriberCount : 1231241,
    },

    /* 버튼 생성 */
    buttons: [
      {
        /* 버튼 이름 */
        title: '웹으로 보기',

        /* 버튼 링크 */
        link: {
          mobileWebUrl: 'https://seonhyungjo.github.io/',
          webUrl: 'https://seonhyungjo.github.io/'
        }
      },
    ]
	});
	//]]>
</script>

  <div class="widget-content">
    <a id="kakao-link-btn2">
      <img src="//developers.kakao.com/assets/img/about/logos/kakaolink/kakaolink_btn_medium.png" />
    </a>
  </div>
  <script>
  Kakao.Link.createDefaultButton({
    container: '#kakao-link-btn2',
    objectType: 'list',
    headerTitle: '리스트형 타이틀',

    /* 헤더 글씨를 클릭시 넘어가는 링크 */
    headerLink: {
      mobileWebUrl: 'https://seonhyungjo.github.io/',
      webUrl: 'https://seonhyungjo.github.io/'
    },

    /* 리스트 형에서 콘텐츠는 다수 가능(일단 타입이 리스트형이네) */
    contents: [{
      title: '첫번째 타이틀',
      description: '첫번째',
      imageUrl: 'https://images4.alphacoders.com/241/thumb-1920-241398.jpg',
      link: {
        mobileWebUrl: 'https://seonhyungjo.github.io/',
        webUrl: 'https://seonhyungjo.github.io/'
      }
    }, {
      title: '두번째 타이틀',
      description: '두번째',
      imageUrl: 'https://images5.alphacoders.com/409/thumb-1920-409764.jpg',
      link: {
        mobileWebUrl: 'https://developers.kakao.com',
        webUrl: 'https://developers.kakao.com'
      }
    }, {
      title: '세번째 타이틀',
      description: '세번째',
      imageUrl: 'https://wallpapers.wallhaven.cc/wallpapers/full/wallhaven-157286.png',
      link: {
        mobileWebUrl: 'https://developers.kakao.com',
        webUrl: 'https://developers.kakao.com'
      },
    }],
    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>