댓글 플러그인

댓글 플러그인을 사용하면 사용자가 Facebook 계정을 사용하여 사이트의 콘텐츠에 대한 댓글을 달 수 있습니다. Facebook에서 친구(및 친구의 친구)와 댓글 달기 활동도 공유하도록 선택할 수 있습니다. 댓글 플러그인에는 기본으로 제공되는 관리 도구와 소셜 관련성 순위도 포함됩니다.

댓글 플러그인 구성 도구관리설정언어 조정FAQ

단계별 안내

1. URL 또는 페이지 선택하기

댓글 플러그인을 사용할 웹사이트의 URL을 선택합니다.

2. 코드 구성 도구에서 코드 생성하기

아래 코드 구성 도구에 URL을 복사하여 붙여넣습니다. 댓글 플러그인의 width 또는 기본적으로 표시할 게시물 수(num_posts)와 같은 설정을 조정할 수 있습니다. 코드 받기 버튼을 클릭하여 댓글 플러그인 코드를 생성합니다.

3. 픽셀 코드 복사하여 붙여넣기

댓글을 구현할 웹사이트나 웹 페이지의 HTML에 픽셀 코드를 복사하여 붙여넣습니다.

댓글 플러그인 코드 생성 도구

댓글을 남길 URL
너비
게시물 수

설정

위의 코드 구성 도구에서는 댓글 플러그인에 가능한 모든 설정의 일부만 사용합니다. 다음과 같은 설정도 변경할 수 있습니다.

설정 HTML5 속성 설명 기본값

colorscheme

data-colorscheme

댓글 플러그인에서 사용하는 색구성입니다. "light" 또는 "dark"일 수 있습니다.

"light"

href

data-href

플러그인에 게시된 댓글이 영구적으로 연결될 절대 URL입니다. 댓글 플러그인을 사용하여 게시한 댓글과 관련하여 Facebook에서 공유한 모든 소식이 이 URL에 링크됩니다.

현재 URL

mobile

data-mobile

모바일에 최적화된 버전의 표시 여부를 지정하는 boolean 값입니다.

자동 감지

num_posts

data-numposts

기본적으로 표시할 댓글 수입니다. 최소값은 1입니다.

10

order_by

data-order-by

댓글을 표시할 때 사용하는 순서입니다. "social", "reverse_time" 또는 "time"이 될 수 있습니다. 여러 다른 순서 유형은 FAQ에 설명되어 있습니다.

"social"

width

data-width

웹 페이지의 댓글 플러그인 너비입니다. 이 값은 유연한 너비의 비율(예: 100%) 또는 픽셀값일 수 있습니다. 댓글 플러그인의 모바일 버전은 너비 매개변수를 무시하는 대신 유동 너비가 100%입니다. 댓글 플러그인에서 지원하는 최소 너비는 320px입니다.

550

댓글 정렬

댓글 플러그인의 오른쪽 상단에 있는 메뉴를 사용하여 시간 또는 소셜 순위별로 댓글의 순서를 지정할 수 있습니다.

data-order-by 속성에 다음 세 값 중 하나를 적용하여 기본 순서를 정의할 수 있습니다.

social(기본값)

이 값은 "상위"라고도 합니다. 댓글 플러그인에서는 소셜 신호를 사용하여 가장 높은 품질의 댓글을 표시합니다. 친구 및 친구의 친구가 작성한 댓글 중에 관련성이 가장 큰 댓글 외에도 좋아요가 가장 많이 클릭되었거나 가장 활발한 토론 대화를 맨 먼저 표시하기 위해 댓글의 순서가 지정됩니다. 스팸으로 표시된 댓글은 보기에서 숨깁니다.

참고: 원본 댓글 플러그인 릴리스 전에 만든 오픈 그래프 개체와 연결된 댓글 스레드 등의 이전 댓글 스레드는 소셜별로 정렬할 수 없습니다.

time

댓글은 게시된 순서대로 표시되며, 가장 오래된 댓글이 맨 위에 표시되고 최신 댓글이 맨 아래 표시됩니다.

reverse_time

댓글은 게시된 순서와 반대로 표시되며 최신 댓글이 맨 위에 표시되고 가장 오래된 댓글이 맨 아래 표시됩니다.

언어 조정

JavaScript용 Facebook SDK의 현지화된 버전을 읽어들여 댓글 플러그인의 언어를 조정할 수 있습니다. SDK를 읽어들일 때 개발자의 언어를 사용하도록 js.src 값을 조정합니다. 예를 들어, en_US를 개발자의 언어로 바꿀 수 있습니다(예: 프랑스어(프랑스)의 경우 fr_FR).

js.src = "//connect.facebook.net/fr_FR/sdk.js#xfbml=1&version=v2.4";

지원 언어는 Facebook 언어 XML 파일에서 참조하세요.

다른 언어에서도 사용할 수 있도록 소셜 플러그인의 너비를 조정해야 할 수도 있습니다. 현지화 및 번역에 대해 자세히 알아보세요.

댓글 관리

댓글 플러그인에는 강력한 관리 도구가 있습니다. 이 도구를 사용하면 커뮤니티 관리 팀에서 보다 쉽고 빠르게 여러 댓글을 한 번에 관리할 수 있습니다.

설정

댓글 관리 도구를 사용하려면 관리 설정 안내를 완료해야 합니다.

관리 설정 안내

댓글 플러그인을 통해 남긴 댓글에 답글을 달기 위해 그래프 API를 사용할 수 없습니다.


대시보드

관리 도구로 이동하는 방법은 다음 두 가지입니다.

1. 앱 기반 관리 보기Developers.facebook.com/tools/comments로 이동합니다. 모든 Facebook 앱 리스트가 표시되므로 각 앱과 연결된 모든 댓글을 관리할 수 있습니다. 댓글 플러그인과 함께 Facebook 앱을 사용하지 않으면 이 보기를 사용할 수 없습니다.

2. 페이지 기반 관리 보기: 댓글 상자 바로 옆의 관리 도구 링크를 클릭합니다(아래 스크린샷 참조). 이 보기는 이 웹 페이지(URL)에 게시된 댓글만 표시합니다.

관리 보기

아래 스크린샷에는 두 가지 관리 보기가 모두 표시됩니다. 앱 기반 관리 보기를 사용하는 경우 메뉴를 사용하여 앱을 변경할 수 있습니다.

관리 테이블에서 해당 상태에 따라 댓글을 승인하거나 숨길 수 있습니다. 여러 댓글의 상태를 변경하려면 왼쪽 열의 확인란을 사용합니다.

1. 페이지 기반 관리 보기

이 관리 보기에서는 특정 url의 모든 댓글이 표시됩니다.

2. 앱 기반 관리 보기

이 관리 보기에서는 앱의 모든 댓글이 표시됩니다.

3. 플래그가 지정된 큐

사용자나 Facebook에서 플래그를 지정한 댓글이 여기에 표시됩니다. 이 리스트의 댓글은 앱 설정 및 댓글 보고 방식에 따라 공개하거나 숨길 수 있습니다.

4. 내 큐

개발자 간에 더 효율적으로 작업을 나누기 위해 이 기능을 사용하여 관리할 댓글을 할당할 수 있습니다. 여기에 할당된 댓글은 여전히 다른 관리자나 댓글 관리자가 사용할 수 있지만 사용자의 큐에 있는 댓글은 다른 큐에 표시되지 않습니다.

설정

앱마다 맞춤 설정을 정의할 수 있습니다. 설정 버튼(도구의 오른쪽 상단에 위치)을 사용하여 설정 대화 상자를 엽니다.


댓글 관리자

댓글 관리자가 되도록 다른 사용자를 승격시킬 수 있습니다. 입력란에 친구의 이름을 입력하기 시작하면, 자동 완성 검색이 표시되어 댓글 관리자가 되게 할 사람을 손쉽게 선택할 수 있습니다.


댓글 정렬 기준

댓글 정렬 방법도 제어할 수 있습니다. 댓글 정렬에 대해 자세히 알아보세요.


관리

새 댓글의 기본 공개 범위를 변경할 수 있습니다. 예를 들어, 새 댓글을 모두 승인하고 싶을 수 있습니다. 댓글이 승인되지 않으면 댓글 관리자가 댓글을 승인할 때까지 댓글 작성자에게만 댓글이 표시됩니다.

다음과 같이 3가지 관리 모드가 있습니다.

공개

모든 댓글이 공개됩니다. 이러한 댓글은 검수 탭에도 표시됩니다.

비공개

모든 댓글을 숨깁니다.

차단된 사용자

차단된 사용자 탭에서 댓글 관리자가 차단된 사용자를 검색할 수 있습니다. 차단된 사용자가 새 댓글을 게시하면 이 댓글은 자동으로 공개 범위가 제한되며 검수 탭에 표시됩니다.


댓글 미러링

댓글 미러링을 사용하면 댓글이 입력되는 위치가 웹 페이지인지 아니면 Facebook 페이지인지에 상관없이 단일 대화에 참여할 수 있습니다. Facebook 페이지에서 웹사이트의 링크를 공유하면 웹 페이지의 댓글이 Facebook 페이지 게시물의 댓글로도 표시되며, 그 반대도 마찬가지입니다. 이와 같이 댓글이 두 위치에 모두 표시되므로 Facebook 페이지와 웹사이트 모두에서 대화가 더욱 풍부해집니다.

설정 탭으로 이동하여 관리 도구에서 댓글 미러링을 켤 수 있습니다. 댓글 미러링을 설정하려면 미러링을 사용할 Facebook 페이지의 페이지 관리자여야 합니다.

댓글 미러링을 활성화한 상태에서 사람들이 댓글에 사진을 포함할 수 있도록 하려면 페이지에 대해 방문자가 페이지에 게시물을 게시하도록 허용도 설정해야 합니다. 댓글이 올바르게 미러링되려면 Facebook 페이지가 공개로 설정되어 있어야 합니다.

댓글 미러링은 해당 기능을 설정한 후에 생성된 새 웹 페이지에 적용됩니다. 특정 웹 페이지에서 댓글 미러링을 켜고 나면 미러링을 비활성화할 방법이 없습니다(새로 만드는 웹 페이지에만 미러링을 끌 수 있음). 따라서 자동 닫기 기능을 사용하고 Facebook 페이지와 공유하는 경우 웹페이지가 아니라 Facebook 페이지 게시물에서 여전히 댓글을 작성할 수 있습니다.

댓글이 미러링되고 있음을 사용자가 알 수 있나요? 웹사이트에서 댓글을 쓰기 시작하면 댓글이 Facebook 페이지에도 표시됨을 알리는 메시지가 표시됩니다. Facebook 페이지에 게시된 아티클에 대해 댓글을 쓰기 시작할 때도 동일한 메시지가 표시됩니다.


관리는 어떻게 작동하나요? Facebook 페이지 게시물에 대한 것인지 아니면 웹사이트의 원본 아티클에 대한 것인지에 상관없이 모든 댓글이 기본 Facebook 댓글 관리 도구에 표시되므로, 아티클 페이지에 표시된 모든 댓글을 관리할 수 있습니다. 관리 도구에서 댓글을 숨기면 Facebook 페이지에서도 자동으로 댓글을 숨깁니다.

URL 설정

스레드 닫기

댓글 플러그인을 사용하는 모든 URL에서 댓글 스레드를 닫을 수 있습니다. 그러면 사용자가 해당 웹 페이지의 토론에 새 댓글을 추가할 수 없습니다. URL 설정 메뉴에서 스레드를 닫을 수 있습니다.

자동 닫기 덮어쓰기

자동 닫기를 사용한 경우 닫은 스레드를 덮어쓰면 댓글을 위해 스레드가 다시 열립니다. 이 작업을 수행하려면 URL 설정으로 이동하여 자동 닫기 덮어쓰기를 켭니다. 그런 다음 관리 중인 URL에 대해 원하는 닫기 상태를 설정합니다.

관리 설정

관리 도구를 사용하려면 Facebook 계정 또는 Facebook 앱을 댓글 플러그인 구현에 연결해야 합니다.

Facebook 앱을 사용하여 설정(기본)

사이트에 댓글 상자가 여러 개인 경우 Facebook 앱 ID를 관리 엔티티로 지정하는 것이 좋습니다. 그러면 앱의 모든 관리자가 댓글을 관리할 수 있습니다. 그러면 앱 ID에서 관리하는 모든 플러그인의 댓글을 모두 쉽게 검토할 수 있는 Facebook의 댓글 관리자 인터페이스를 사용할 수 있습니다.

<meta property="fb:app_id" content="{YOUR_APP_ID}" />

댓글 관리자 설정을 사용하여 추가한 사람 외에 앱의 모든 관리자도 댓글을 관리할 수 있지만, 알림이 활성화된 경우 댓글 관리자만 새로운 댓글에 대한 알림을 받을 수 있습니다.

사이트에 여러 댓글 상자를 구현하고 앱 ID를 지정하여 서로 연결한 경우 선택한 관리 설정이 모든 댓글 상자에 적용됩니다.

예를 들어 관리 설정을 공개 범위 제한됨으로 변경하면 동일한 앱 ID의 모든 댓글 상자에 영향을 미칩니다. 사이트의 여러 다른 영역에 다양한 관리 설정을 적용해야 하는 경우 두 개 이상의 앱 ID를 사용해야 합니다. 그런 다음 댓글 상자의 각 그룹에 서로 다른 관리 설정을 적용할 수 있습니다.

fb:app_id 또는 fb:admins 중 하나만 지정할 수 있습니다.

관리자로 Facebook 계정 할당

Facebook 계정을 댓글 플러그인 구현의 관리자로 지정하려면 댓글 플러그인을 사용하는 모든 웹 페이지의 <head> 섹션에 다음 메타 태그를 포함하기만 하면 됩니다.

<meta property="fb:admins" content="{YOUR_FACEBOOK_USER_ID}"/>

여러 댓글 관리자를 추가하려면 각각 하나의 Facebook ID를 사용하는 둘 이상의 요소를 추가합니다.

<meta property="fb:admins" content="{YOUR_FACEBOOK_USER_ID_1}"/>
<meta property="fb:admins" content="{YOUR_FACEBOOK_USER_ID_2}"/>

댓글 카운터

fb:comments-count 값을 사용하면 웹 페이지의 <span> 요소에 지정된 URL에 대한 댓글 수가 표시됩니다. 그러면 CSS를 사용하여 나머지 웹사이트와 일치하도록 이 <span> 요소의 스타일을 지정할 수 있습니다. 참고: 이 기능은 현재 HTML5에서 사용할 수 없습니다.

예를 들어 example.com의 댓글 수를 표시하려면 다음 코드를 사용합니다.

<span class="fb-comments-count" data-href="http://example.com/"></span>
awesome comments 

그러면 다음이 표시됩니다.

69391 awesome comments

지정된 URL에 남긴 댓글 수는 그래프 API를 통해 액세스할 수 있습니다. 예를 들어 URL 노드의 share 필드에서 comment_count 속성을 통해 사용할 수 있는 example.com의 댓글 수는 다음과 같습니다.

https://graph.facebook.com/v2.4/?fields=share{comment_count}&amp;id=<YOUR_URL>

Webhooks

새 댓글이 게시되면 서버의 스크립트에 알리도록 webhooks를 설정할 수 있습니다. 시작하려면 다음 단계를 따르세요.

  1. 앱 대시보드로 이동합니다.
  2. 먼저 왼쪽 탐색 메뉴에서 "+ 제품 추가"를 클릭합니다.
  3. Webhooks 섹션에서 "설정"을 클릭합니다.
  4. 드롭다운에서 "앱"을 선택합니다.
  5. "이 주제 받아보기" 버튼을 클릭합니다.
  6. 대화 상자에 알림을 받을 스크립트의 URL을 입력합니다(예: https://example.org/mywebhook.php)
  7. 토큰(선택한 문자열)을 입력합니다. 토큰은 확인을 위해 스크립트에 전송됩니다.
  8. 마지막으로 "확인 및 저장" 버튼을 클릭하면 완료됩니다.

단, 완료하기 전에 Webhooks 설명서에서 스크립트를 구현하는 방법에 대한 상세 정보를 먼저 살펴보는 것이 좋습니다.

다음은 mywebhook.php가 PHP에 표시되는 간단한 예입니다.

확인 시작:

<?php
if ($_GET['hub_verify_token'] === 'make-up-a-token') {
  echo $_GET['hub_challenge'];
}

make-up-a-token은 위 7단계에서 입력한 것과 같은 문자열입니다.

그런 다음 모든 댓글을 게시되는 대로 로깅하면 됩니다.

file_put_contents(
  'log.txt',
  "\n" . file_get_contents('php://input'),
  FILE_APPEND
);
?>

PHP에서 $_POST는 작동하지 않습니다. file_get_contents('php://input')가 필요합니다.

Webhook을 확인하고 나면 앱 대시보드의 Webhooks 섹션에 "plugin_comment" 및 "plugin_comment_reply"가 표시됩니다.

"테스트"를 클릭하여 샘플 응답으로 구현을 다시 확인한 다음 "받아보기"를 클릭하여 게시합니다.

응답에 대해 자세한 내용은 Webhooks 참조 설명서를 참조하세요.