소셜네트워크 서비스 중 페이스북의 좋아요 버튼을 구현 하는 방법을 정리 합니다.
[좋아요 버튼 구현하기]
출처: http://kkid.tistory.com/68
이 문서는 위 포스트를 참고하여 만들었습니다. 더욱 깔끔한 포스트를 보시려면 해당 포스트를 찾아가세요.
1. 코드생성
http://developers.facebook.com/docs/reference/plugins/like
위의 사이트로 이동해서 코드를 생성한다.
URL to Like : 좋아요버튼을 사용할 블로그 또는 사이트 주소를 적는다.
Layout Style : 버튼의 스타일을 정한다.(Standard,button_count,box_count)
오른쪽에 미리보기가 되므로 마음에 드는걸 선택한다.
Show Faces : 좋아요를 눌러주신 분들의 페이스북 프로필 사진이 나타납니다.
Witdh : 넓이를 조절합니다.
[좋아요 버튼 구현하기]
출처: http://kkid.tistory.com/68
이 문서는 위 포스트를 참고하여 만들었습니다. 더욱 깔끔한 포스트를 보시려면 해당 포스트를 찾아가세요.
1. 코드생성
http://developers.facebook.com/docs/reference/plugins/like
위의 사이트로 이동해서 코드를 생성한다.
URL to Like : 좋아요버튼을 사용할 블로그 또는 사이트 주소를 적는다.
Layout Style : 버튼의 스타일을 정한다.(Standard,button_count,box_count)
오른쪽에 미리보기가 되므로 마음에 드는걸 선택한다.
Show Faces : 좋아요를 눌러주신 분들의 페이스북 프로필 사진이 나타납니다.
Witdh : 넓이를 조절합니다.
Verb to display : 버튼에 Like 또는 Recommend 중 어느 것이 적힐지 고르게 되는 부분인데
한국어로는 Like 는 '좋아요', Recommend 는 '추천' 이라고 나타납니다.
Font : 글씨체를 선택할 수 있습니다.
Color Scheme : 버튼 색상을 밝은색 또는 어두운색으로 선택할 수 있습니다.
Get Code : 클릭하면 새 창이 뜬다.
iframe 과 XFBML 두가지 코드를 제공하는데 'iframe' 코드를 사용합니다.
2. 코드수정
아래와 같은 코드가 생성 됩니다.
<iframe src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.myblog.com&layout=box_count&show_faces=false&width=450&action=like&colorscheme=light&height=65" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:65px;" allowTransparency="true"></iframe>
이대로 좋아요 버튼을 블로그에 적용, 삽입하게 되면 어느 페이지에서 클릭을 하든
블로그 자체에 좋아요가 적용되게 됩니다.
그래서 개개의 포스팅에 좋아요 버튼을 적용하려면 아래와 같이 블로그 주소 뒤에
[##_article_rep_link_##] 를 추가 하면 됩니다.
<iframe src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.myblog.com[##_article_rep_link_##]&layout=box_count&show_faces=false&width=450&action=like&colorscheme=light&height=65" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:65px;" allowTransparency="true"></iframe>
3. html 페이지에 좋아요 버튼 달기
원하는 곳에 위의 코드를 삽입하면 끝….
4. 좋아요 통계보기
[참고사이트]
댓글