1개 페이지에 2개 이상의 페이스북 댓글 박스 넣기

저는 워드프레스 홈페이지라는 페이스북 그룹을 자주 방문합니다. 거기에서 토닥토닥 운영자 분을 알게 되었고, 운 좋게도 토닥토닥의 사이트 내부를 볼 기회가 있었습니다. 관련하여 재미있고 간단한 팁이 있어서 공유합니다.

 

“1 개의 페이지 또는 포스트에 2개 이상의 댓글 박스를 달고, 댓글이 따로 따로 반응하게 하려면?” 

 

아주 특별한 경우가 아니면 이런 방식이 필요하지 않겠지만, 토닥토닥의 경우는 찬성/반대의 의견을 따로 받고 있어서 매우 필요한 기능이었습니다. 운영자 분은 웹전문가가 아닌 전혀 다른 업종의 종사자 임에도 창의적인 방법으로 이를 구현하셨더군요. 내부사정이니 자세히 공개하면 실례일 것이고…

 

페이스북 댓글을 넣으려면 facebook social plugin 에서 소스를 받아서…. 아래처럼 넣습니다.

<div data-href="<?php the_permalink(); ?>" data-num-posts="5" data-width="600"></div>

 

관련링크 : 워드프레스에서 페이스북 댓글달기(social plugin)

참고링크 : permalink 변경 후 facebook comment 와 like 불러오기

 

2개 이상의 댓글 박스를 넣기 위해 위의 소스를 2번 넣어도 1개의 댓글박스만 나옵니다. 왜? url이 동일하기 때문입니다.

1
2
3
<div  class="fb-comments" data-href="<?php the_permalink(); ?>" data-num-posts="5" data-width="600"></div>
<div  class="fb-comments" data-href="<?php the_permalink(); ?>/#comment2" data-num-posts="5" data-width="600"></div>
<div  class="fb-comments" data-href="<?php the_permalink(); ?>/#comment3" data-num-posts="5" data-width="600"></div>
<div  class="fb-comments" data-href="<?php the_permalink(); ?>" data-num-posts="5" data-width="600"></div>
<div  class="fb-comments" data-href="<?php the_permalink(); ?>/#comment2" data-num-posts="5" data-width="600"></div>
<div  class="fb-comments" data-href="<?php the_permalink(); ?>/#comment3" data-num-posts="5" data-width="600"></div>

처럼 url뒤에 /#comment2, #comment3,#comment4…. 를 넣으면 1개의 url에 다수의 페북 댓글을 넣을 수 있습니다.

플러그인으로 페북 댓글을 설치하신 분이나, 플러그인의 shortcode를 사용하시는 분은?

마찬가지 입니다. 플러그인은 php the_permalink();를 100% 사용합니다. 다만, 2번째 댓글박스 부터는 직접 소스를 넣어야 겠죠.

그래도 안된다??? php the_permalink(); 대신에 해당 페이지의 url을 직접 넣습니다. data-href=”http://YOUR-URL/#comment2″ 와 같이 사용합니다.

 

 

Submit a Comment

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code lang=""> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong> <pre lang="" extra="">

Share This