티스토리 블로그에 페이스북 댓글 플러그인 설치하기 :: 2proo Life Story ::

티스토리 블로그에 페이스북 댓글 플러그인 설치하기

2013.02.08 10:40
티스토리 블로그에 페이스북 댓글 플러그인 설치하기

페이스북에서는 여러 종류의 플러그인을 제공해주고 있습니다. 명함 위젯 플러그인도 있고 타임라인 위젯 플러그인도 제공해주고 있습니다. 그중에 소셜 댓글, 즉 페이스북 내에서의 댓글 입력이 아닌 웹사이트나 블로그에서 댓글을 달 수 있는 플러그인이 있습니다. 이 플러그인이 제공된지는 꽤 되었지요.

일반 웹사이트나 티스토리 블로그에 페이스북 댓글 플러그인을 설치하는 방법은 크게 두가지 입니다.
1. 페이스북 APP을 만들어 플러그인을 생성하고, 방문자들이 입력한 덧글들을 관리하는 방법.
2. 덧글 입력 플러그인만 설치하는 방법 (관리가 잘 안됨)

그중에 1번 방법은 단계가 복잡하므로 언젠가 따로 포스트를 올리도록 하고...
저도 그냥 쓰고 있는 2번 방법에 대한 이야기입니다.

제 블로그 하단에는 아래 이미지처럼 페이스북을 이용한 댓글 플러그인이 설치되어있습니다.
블로그상에도 페이스북 댓글이 보여지고, 방문자의 페이스북 담벼락에도 동시에 댓글이 올라가게 됩니다.

 
이 페이스북 소셜 플러그인, 댓글 플러그인을 설치하는 방법은 간단합니다.

https://developers.facebook.com/docs/reference/plugins/comments/

위 주소에 들어가면 아래 이미지와 같은 댓글 소셜 플러그인 생성창이 나옵니다.
URL to comment on : 자신의 블로그 주소를 적어주면 됩니다.
Width : 댓글 플러그인이 표시될 너비, 폭 수치
Number of posts : 페이스북 덧글이 한번에 보여질 갯수
Color Scheme : 화이트 컬러와 블랙 컬러 둘 중 하나의 색상 세트


다 입력하고 나서 Get Code 버튼을 누르게 되면 아래와 같이 댓글 플러그인 코드가 나옵니다.
HTML5 모드로 1, 2 두개의 코드가 생성됩니다. 이 두개 소스를 티스토리 html 스킨 설정 페이지에서 입력해줍니다.

1번 코드의 경우 <head> 와 </head> 사이, 혹은 <body> 바로 뒤에 넣어줍니다. 솔직히 위치는 그닥 중요하지 않습니다.
그리고 2번 코드를 페이스북 덧글이 표시될 공간에 넣어주면 됩니다.


여기서 주의할 점이 있는데 2번 코드에 추가해줘야 할 것이 있습니다.
data-href 속성값에 자신의 블로그 주소를 입력하는데 블로그 주소 뒤에 해당 포스트의 고유 주소 URL 치환자를 넣어주어야 합니다. 그래야 각각의 블로그 포스트에 해당 페이스북 댓글이 달리게 됩니다.


위 이미지처럼 블로그 주소뒤에 [ # #_article_rep_link_# #] 을 붙여준 후 스킨에 넣어주면 완료됩니다.

data-width 속성값은 플러그인의 너비 이므로 스킨상에서 수정해줘도 됩니다.
data-num-posts 속성값은 보여줄 댓글 갯수입니다. 이 역시도 새로운 코드 발급 없이 각자 수정이 가능합니다.

이상 티스토리 블로그에 페이스북 댓글 플러그인 설치하는 방법이었습니다.

페이스북 관련 포스트
페이스북 '좋아요' 를 현실로?? 페이스북 좋아요 카드 인증 및 신청방법
페이스북 트위터 구글플러스 동시 발행 플러그인 Socialba - 크롬 파이어폭스 익스플로러
페이스북 유형, 나는 페이스북 사용자 유형중 어떤 유형일까요? - Facebook Type
페이스북 방문자 추적 방법? 이건 어때요? 페이스북 방문자 추적기!!!
블로그에 페이스북 좋아요 버튼 설치하는 방법 Facebook Like button
페이스북 내캘린더 요청 애드웨어 차단 및 삭제 방법 - my calendar, 마이캘린더 앱
페이스북 가입일 알아보는 방법 그리고 2proo 페이스북 계정 생성일 2주년이 되었네요
페이스북 이메일 폭탄, 하루 수십개씩 오는 페이스북 알림 이메일 막는 페북 설정 방법
페이스북 메신저, 강력한 위치추적 서비스로 커플 메신저 등극 사생활 침해는?

신고

BLOG Story , , , , , , , , , , , , , , , ,



  1. 보안 문자 좀 제거해줘요
    한번 틀리면 다시 입력하기 귀찮아요

  2. 그거 빼면 스팸이 너무 달려서 안대요 ㅋㅋㅋ

  3. 티스토리 로그인해서 달면 보안안뜨잖아요

  4. 그러니까요~!!!! 흐흐흐흐

  5. 그래요? 로그인하면 안 나와요? 그걸 왜 지금 알려주는 거죠!!!

  6. 너무 감사합니다. 이렇게 간단한거였군요. 쉽게 알려주셔서 감사합니다.
    다른분 포스팅보고 따라했다고 포기했었그던요. 전화번호 넣는데 인증이 안와서 ㅠㅠ
    설연휴잘보내세요

  7. 으잉?? 페이스북 덧글 연동 플러그인 설치하는데
    왜 전화번호 인증이 필요한가요;;;;;;; 여튼 수고하셧습니다 ^^;;

  8. 음 무슨개발자인가 등록하라고 그랬던거 같아요 이상한데로 들어갔었나봐요 하하 ㅋㅋ 어째든 이제 설치해서 기쁩니다 !!

  9. ㅎㅎㅎ 우여곡절을 겪으셧군요~ 어쨋든 설치 축하드려요 ^^

  10. 저도 달았다가....

  11. 달면 더 좋은데... 왜 빼셧어요 ^^;;

  12. 좋은 글 잘 보았습니다. 이렇게 블로그에 페이스북 소셜 댓글창을 만든 경우, 다른 분들이 페이스북으로 댓글을 다셔도 제게는 알림이 안뜨더군요;; 혹시 알림이 뜨게 하는 방법은 없을까요?

  13. 알림 받는 방법은 아직 없는걸로 알고 있습니다.
    다만 https://developers.facebook.com/tools/comments 이곳에 가셔서 직접 확인하는 수밖에 없을듯 하네요...

  14. 답변감사합니다~!