■ 카카오 디벨로퍼 애플리케이션 생성
카카오 디벨로퍼에 가입하지 않은 사람이라면 우선 여기서 가입을 하고 다음 작업을 진행한다.
03. 제작할 앱의 아이콘과 이름을 작성하고, 앱 만들기 버튼을 클릭하면 앱이 생성된다.
04. 앱이 다 만들어지면 자바스크립트 키를 발급받게 되는데 이 키를 잘 기억해 두자.
05. 마지막으로 생성한 애플리케이션에 사이트 도메인을 입력한다.
① 위에서 생성한 애플리케이션을 선택한다.
② 좌측 카테고리의 설정 → 일반을 선택한다.
③ 사이트 도메인부분에 사용할 사이트 도메인을 입력한다.
(해당 포스팅은 http://localhost 를 사용하였다.)
④ 저장 버튼을 눌러 설정을 저장하면 사용할 준비가 완료되었다.
■ 카카오 톡 공유 템플릿 제작하기
#01. 카카오톡 피드 템플릿 제작
# 소스코드
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>:: 카카오톡 공유하기 ::</title>
<script type="text/JavaScript" src="https://developers.kakao.com/sdk/js/kakao.min.js"></script>
<script type="text/javascript">
function shareKakaotalk() {
Kakao.init("XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX"); // 사용할 앱의 JavaScript 키를 설정
Kakao.Link.sendDefault({
objectType:"feed"
, content : {
title:"WARCRAFT3 THE REIGN OF CHAOS" // 콘텐츠의 타이틀
, description:"너흰아직 준비가 안되었다!" // 콘텐츠 상세설명
, imageUrl:"illidan_stormrage.jpg" // 썸네일 이미지
, link : {
mobileWebUrl:"http://magic.wickedmiso.com/" // 모바일 카카오톡에서 사용하는 웹 링크 URL
, webUrl:"http://magic.wickedmiso.com/" // PC버전 카카오톡에서 사용하는 웹 링크 URL
}
}
, social : {
likeCount:0 // LIKE 개수
, commentCount:0 // 댓글 개수
, sharedCount:0 // 공유 회수
}
, buttons : [
{
title:"게시글 확인" // 버튼 제목
, link : {
mobileWebUrl:"http://magic.wickedmiso.com/" // 모바일 카카오톡에서 사용하는 웹 링크 URL
, webUrl:"http://magic.wickedmiso.com/" // PC버전 카카오톡에서 사용하는 웹 링크 URL
}
}
]
});
}
</script>
</head>
<body>
<h1>카카오톡 공유하기</h1>
<input type="button" onClick="shareKakaotalk();" value="KAKOA Talk으로 공유하기"/>
</body>
</html>
|
# 출력결과
#02. 카카오톡 위치 템플릿 제작
# 소스코드
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>:: 카카오톡 공유하기 ::</title>
<script type="text/JavaScript" src="https://developers.kakao.com/sdk/js/kakao.min.js"></script>
<script type="text/javascript">
function shareKakaotalk() {
Kakao.init("XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX"); // 사용할 앱의 JavaScript 키를 설정
Kakao.Link.sendDefault({
objectType:"location"
, address:"노스렌드" // 공유할 위치의 주소
, addressTitle:"얼음왕관의 성채" // 카카오톡 내의 지도 뷰에서 사용되는 타이틀
, content: {
title:"WARCRAFT3 THE FROZEN THRONE" // 콘텐츠의 타이틀
, description:"왕위를 계승하는 중입니다. 아버지" // 콘텐츠 상세설명
, imageUrl:"arthas_menethil.jpg" // 썸네일 이미지
, link: {
mobileWebUrl:"http://magic.wickedmiso.com/" // 모바일 카카오톡에서 사용하는 웹 링크 URL
, webUrl:"http://magic.wickedmiso.com/" // PC버전 카카오톡에서 사용하는 웹 링크 URL
}
}
, social: {
likeCount:0 // LIKE 개수
, commentCount:0 // 댓글 개수
, sharedCount:0 // 공유 회수
}
, buttons: [
{
title:"버튼 제목" // 버튼 제목
, link: {
mobileWebUrl:"http://magic.wickedmiso.com/" // 모바일 카카오톡에서 사용하는 웹 링크 URL
, webUrl:"http://magic.wickedmiso.com/" // PC버전 카카오톡에서 사용하는 웹 링크 URL
}
}
]
});
}
</script>
</head>
<body>
<h1>카카오톡 공유하기</h1>
<input type="button" onClick="shareKakaotalk();" value="KAKOA Talk으로 공유하기"/>
</body>
</html> |
# 출력결과
