'티스토리'에 해당되는 글 1건

  1. 2011.07.19 티스토리 블로그 페이스북 소셜댓글 설치하기 – Comment Plugin (1)

 

 

페이스북을 사용하면서 소셜댓글의 강력한 파워를 계속 느껴서

내 블로그에도 설치하고, 앞으로 만들 홈페이지에도 설치하고….

..하려 했는데, 이 귀차니즘이란게 참 무섭군요…;;;

 

 

아무튼 각설하고, 페이스북 소셜댓글을 블로그나 홈페이지에 달아봐요.

 

아래의 페이스북 개발자 페이지의 플러그인 페이지에 접속합니다.

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

접속 후 로그인하고, 인증절차를 거쳐야 되요.

휴대폰 인증절차를 거쳐야 하므로 자신의 계정으로 접속하는 것이 좋습니다.

어차피 코드만 따면 되니까 접속 아이디 등은 상관없기 때문에

편한 대로 하면 됩니다.

 

플러그인 페이지는 이렇게 생겼네요.

 

 

 

 

영어로 되어있지만 위에서부터 좋아요, 공유하기, 댓글달기 순입니다.

그 아래 기능들은 꽤 고급 기능처럼 보이는데, 다음에 한번 해보도록 하구요

 

오늘은 소셜댓글을 설치해야 하니까, 댓글달기(Comment) 버튼을 클릭합시다.

 

 

 

 

이런 화면이 나오는데

중요한 건 아래의 회색 박스를 채우는 것입니다.

 

 

 

 

전 이렇게 채웠습니다.

URL to comment on 에는 페이스북 소셜댓글을 설치할 URL을 넣습니다. 난 블로그 주소를 넣었어요.

Number of posts 에는 한 화면에 보여질 댓글 수를 나타냅니다. 넘어가면 다음 페이지에 정렬되죠.

Width 는 가로길이입니다. 내 블로그 포스트 가로길이인 700픽셀을 입력했습니다.

Color Scheme 에 댓글 박스 색을 선택하면 됩니다. Light와 dark 두가지가 있습니다.

 

설정을 마치면 아래처럼 예시 댓글 박스가 표시됩니다.

 

 

 

 

마음에 들면 Get Code 를 클릭합니다.

 

 

 

 

생성된 코드는 아래와 같습니다.

 

<div id="fb-root"></div><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:comments href="http://ajenneja.tistory.com/" num_posts="15" width="700" colorscheme="dark"></fb:comments>

 

빨간색으로 표시한 부분이 위 박스에서 설정한 내용입니다.

다 맞는데 윗부분에 en_US ko_KR로 수정해야 한글로 나옵니다.

영어를 원하시는 분은 그냥 두세요.

 

그리고 하나 더 http://ajenneja.tistory.com/ 뒤에 ##_article_rep_link_## 를 추가합니다.

##_article_rep_link_## 티스토리 포스트 링크를 구분하는 치환자로서

블로그 주소만 입력한 상태라면 모든 포스트에 같은 소셜댓글이 적용되므로

위 코드를 추가해야 포스트 별로 댓글이 구분됩니다.

 

완성된 코드입니다.

 


 

위 소스코드를 티스토리 댓글 삽입 부분에 붙여넣으면 됩니다.

티스토리 admin 스킨에서 HTML/CSS편집을 선택합니다.

 

 

 

 

붙여넣는 위치에 따라 소셜댓글이 표시되는 위치가 달라집니다.

우선 블로그 본문 내용 하단에 소셜댓글을 붙여넣어봅시다.

##_article_rep_desc_## 치환자 (블로그 본문내용) 아래에 코드를 붙여넣습니다.

 

 

 

 

그렇게 하니 이렇게 출력되는군요.

 

 

 

 

포스트 영역 안에 소셜댓글이 들어가 있고, 그 아래에 티스토리 덧글이 표시됩니다.

그런데 좀 허접하네요…

티스토리 덧글과 함께 표시되도록 바꾸는게 좋겠네요~

 

 

 

 

페이스북 덧글 코드 아래에 삽입합니다.

스킨별로 다르니 주의해서 삽입하는 것이 좋아요~ 가로길이도 좀 줄여야겠죠.

 

 

 

 

설치 완료 했습니다.

기존 티스토리 댓글 박스 안에 페이스북 소셜댓글 박스를 삽입한 상태입니다.

페이스북 소셜덧글과 티스토리 댓글을 합치지는 못해 반쪽짜리일 수도 있지만

그래도 내 페이스북 친구들에게 블로그 글에 대해 직접 코멘트를 달수 있도록

만들었다는데 의의를 두려구요~^^ 긍정적으로 생각해야죠~

 

신고