[블로그팁]페이스북(facebook) 소셜 플러그인 : 좋아요(like) 버튼을 원하는 위치에 넣는 방법

예전 소셜네트워크서비스(sns) 플러그인 설정방법을 통해 페이스북 좋아요 버튼을 적용하는 방법을 설명했었는데요.
[블로그팁]티스토리에서 소셜 네트워크 서비스(SNS) 플러그인 설정

티스토리 플러그인으로 구현한 좋아요 버튼의 단점

이 방법은 티스토리의 플러그인을 사용하기 때문에 버튼의 크기나 모양등을 변경하는데 약간의 제약이 있구요.
또 한가지로 좋아요 버튼을 원하는 위치에 삽입하지 못한다는 크나큰 단점이 있었습니다.

이것은 제 블로그에 삽입된 위치입니다. 본문의 가장 마지막 부분에 자동으로 삽입되어 보여지는데요.
위치는 고사하고 하다못해 가운데로 정렬하고 싶어도 불가능했답니다.

그럼 이런 얘기를 하는 이유가 뭘까요?
눈치채셨겠지만 버튼을 원하는 위치에 삽입할 방법이 있다는 것이죠.

페이스북 개발자 페이지에서 플러그인 만들기

바로 플러그인을 직접 만드는 것입니다..... 라기 보다는 입맛대로 설정한다는게 맞는 표현이겠죠?

일전에 소셜댓글 플러그인 설치를 설명할 때 '페이스북 개발자 페이지'를 언급했었습니다.
[블로그팁]티스토리에 페이스북 소셜댓글 플러그인 설치하기

위의 포스트에서 설명했던 페이스북 개발자 페이지로 이동합니다.

위와 같이 소셜 플러그인이라는 문구와 아래의 여러가지 플러그인을 확인 할 수 있는데요.
표시한 것과 같이 'Like Button'을 클릭합니다.

그러면 위에 자세한 설명을 흘려버리고 아래로 스크롤을 조금 내리면 위와 같은 설정 화면을 볼 수 있습니다.

몇가지 항목을 간단하게 설명드릴게요.

URL to Like
- 좋아요 버튼을 삽입할 사이트 주소

Send Button(XFBML Only)
- 추가로 보내기 버튼을 삽입하는 내용인 듯 하구요. 티스토리에서는 주로 HTML, IFRAME을 사용하니까 패스

Layout Style
- 좋아요 버튼의 모양을 선택

Width
- 가로 크기

Show Face
- 좋아요 버튼을 클릭한 사람의 얼굴을 보임

Verb to Display
- 좋아요 혹은 추천으로 보이도록 선택(결국은 같은 의미)

Color Scheme
- 버튼의 밝음과 어두움 선택

Font
- 영문서체 몇가지 중 선택(한글로 보이게 할 경우 폰트는 숫자에만 적용됨)

지난 번과 마찬가지로 이번에도 바로 이동하실 수 있도록 링크를 남겨드릴게요.
http://developers.facebook.com/docs/reference/plugins/like