BLOG Story
티스토리 블로그에 페이스북 댓글 플러그인 설치하기
2proo
2013. 2. 8. 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주년이 되었네요
페이스북 이메일 폭탄, 하루 수십개씩 오는 페이스북 알림 이메일 막는 페북 설정 방법
페이스북 메신저, 강력한 위치추적 서비스로 커플 메신저 등극 사생활 침해는?
페이스북에서는 여러 종류의 플러그인을 제공해주고 있습니다. 명함 위젯 플러그인도 있고 타임라인 위젯 플러그인도 제공해주고 있습니다. 그중에 소셜 댓글, 즉 페이스북 내에서의 댓글 입력이 아닌 웹사이트나 블로그에서 댓글을 달 수 있는 플러그인이 있습니다. 이 플러그인이 제공된지는 꽤 되었지요.
일반 웹사이트나 티스토리 블로그에 페이스북 댓글 플러그인을 설치하는 방법은 크게 두가지 입니다.
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주년이 되었네요
페이스북 이메일 폭탄, 하루 수십개씩 오는 페이스북 알림 이메일 막는 페북 설정 방법
페이스북 메신저, 강력한 위치추적 서비스로 커플 메신저 등극 사생활 침해는?