웹마스터 팁
XE에 페이스북 소셜 댓글 연동하는 방법 (페이스북 소셜댓글 달기)
2014.08.30 22:46
// http://kitolll.com/9 에 올린 글입니다. 궁금하신 점은 블로그 댓글로 문의해주세요.
0. XE로 운영되는 사이트에 XE 기본 댓글 기능을 없애고 페이스북 소셜 댓글을 달려한다. 어떻게 해야할까?
1. 페이스북 디벨로퍼 사이트의 Comments 페이지 (https://developers.facebook.com/docs/plugins/comments) 에 접속한다.
2. 아래 캡처 화면을 참고하여 필요사항을 기입한 후 Get Code 버튼을 누른다.
3. Get Code 버튼을 누르면 아래와 같은 화면이 나온다.
4. 위의 화면에 있는 소스를 간단히 설명을 하자면 위에 박스에 있는 소스를 <body> 다음에 바로 나오게 (사이트의 wrap 보다 위에), 밑에 박스는 소셜 댓글이 나올 부분에 부착하면 된다.
(layout.html 파일)
위 박스에 있는
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/ko_KR/sdk.js#xfbml=1&version=v2.0";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
태그를 위 캡쳐 화면을 참고하여 layout.html 에 삽입해준다.
5. 이제 페이스북 소셜 댓글이 들어갈 곳에 아래 박스에 있던 소스 코드를 삽입해주면 되는데(본인의 경우 _comment.html에 있는 모든 소스 코드를 삭제하고, 페이스북 소셜 댓글만 붙였다.) 조금 수정해줘야 할 것이 있다.
<div class="fb-comments" data-href="http://kitolll.com" data-width="500" data-numposts="5" data-colorscheme="light"></div>
위와 같이 해버리면 댓글이 게시글마다 보이는 것이 아닌 kitolll.com 이라는 홈페이지 안에 모든 댓글이 쌓여버리게 된다. (XE에서의 주소 구조 같은 경우, (http://설치주소/글번호) 인데 이것을 일일이 글 하나 하나 추가해줄순 없으니 자동으로 data-href 부분에 (http://설치주소/글번호)가 입력되도록 해야한다.
방법은 아주 쉽다. http://kitolll.com 대신 {$oDocument->getPermanentUrl()} 을 넣어주면 된다.
<div class="fb-comments" data-href="{$oDocument->getPermanentUrl()}" data-width="500" data-numposts="5" data-colorscheme="light"></div>
XE로 운영되고 있는 사이트의 소스 코드 (게시판 모듈 default 스킨의 _comment.html 파일)
6. 끝.
p.s XE 모바일 게시판에서 적용을 원할시에도 위와 같으며, 티스토리 블로그에 적용하는 방법도 비슷하다.
댓글 0
| 제목 | 글쓴이 | 날짜 |
|---|---|---|
| 모달 윈도우 | pixfine | 2014.09.15 |
| 홈페이지 접속시 XE를 바로 실행하기 [7] | ezi | 2011.08.20 |
| 외국어 스팸 방어 [2] | DoorWeb | 2014.07.01 |
| 포인트선물 애드온 차감시키는 방법 | 410contents | 2014.09.12 |
| 카페24 웹호스팅에서 서브 도메인으로 접속 방법 [5] | 데이스타 | 2010.03.28 |
| 게시판 목록에서 새창 띄워서 다른 형태 나오게 하기 [3] | foret | 2014.02.23 |
| 회원정보보기시 공개 안 한 정보에 대해서도 최고관리자는 볼 수 있도록 변경 | sejin7940 | 2014.09.10 |
| 모바일뷰 사용하는 경우, 사이트맵에서 메뉴 생성시, 모바일 뷰 가 자동으로 체크되도록 | sejin7940 | 2014.09.10 |
| 로그인 불가 - APM 관리자일 때 (일반적인 경우 아님) [3] | Sx3 | 2007.08.26 |
| XE코어 업데이트(판올림) 정확한 방법 [12] | 카이닉스 | 2012.07.30 |
| [팁]포럼 모듈 인용글 박스 문제 해결 - 1.7.3 기준 [5] | socialskyo | 2013.03.27 |
| 고도몰과 xe 회원 연동하는 키 포인트 | 410contents | 2014.09.03 |
| 애드온 개발중에 이상한 버그가 생길경우 [2] | 銀童 | 2014.08.26 |
| div 세로 중앙 정렬팁 | Ansi™ | 2014.09.01 |
| 카카오톡으로 보내기(깔끔한 뷰) [4] | seyriz | 2014.08.11 |
socialXE 에서 로그인시 소셜로그인과 XE 로그인 동시 구현하기
 | 큐우우 | 2014.08.31 |
| XE에 페이스북 소셜 댓글 연동하는 방법 (페이스북 소셜댓글 달기) | 기톨닷컴 | 2014.08.30 |
|
카메론 플러그인 에드온이 컨텐츠(본문)을 가릴때 팁
| oscarmike | 2014.08.30 |
| 게시판의 오늘 올라온 새글의 갯수를 알아내는 방법 [8] | garnecia | 2014.08.22 |
| 캡챠(captcha)가 안 뜰 때 | Double'U' | 2014.08.29 |