그래프 API 버전 2.11 릴리스부터 보내기 버튼이 사용 중단되었습니다. 그래프 API 버전 2.10 이하의 경우 2018년 2월 5일까지 보내기 버튼이 지원됩니다.

보내기 버튼

보내기 버튼을 사용하면 사람들이 개발자 사이트의 콘텐츠를 한 명 이상의 친구에게 Facebook 메시지로 보낼 수 있습니다.

보내기 버튼 구성 도구코드 예시설정FAQ

단계별 안내

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

보낼 Facebook 페이지나 웹사이트의 URL을 선택합니다.

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

코드 구성 도구에 URL을 붙여넣고 Get Code 버튼을 클릭하여 보내기 버튼 코드를 생성합니다.

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

랜딩 페이지 웹사이트의 HTML에 픽셀 코드를 복사하여 붙여넣습니다.

보내기 버튼 구성 도구

보낼 URL

전체 코드 예시

코드 예를 복사하여 웹사이트에 붙여넣습니다. data-href 값을 웹사이트 URL로 조정합니다. 다음으로 og:*** 메타 태그를 사용하여 링크 미리 보기를 조정합니다. og:urldata-href에서 같은 URL을 사용해야 합니다.

<html>
<head>
  <title>Your Website Title</title>
    <!-- You can use open graph tags to customize link previews.
    Learn more: https://developers.facebook.com/docs/sharing/webmasters -->
  <meta property="og:url"           content="https://www.your-domain.com/your-page.html" />
  <meta property="og:type"          content="website" />
  <meta property="og:title"         content="Your Website Title" />
  <meta property="og:description"   content="Your description" />
  <meta property="og:image"         content="https://www.your-domain.com/path/image.jpg" />
</head>
<body>

  <!-- Load Facebook SDK for JavaScript -->
  <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 = "https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.5";
    fjs.parentNode.insertBefore(js, fjs);
  }(document, 'script', 'facebook-jssdk'));</script>

  <!-- Your send button code -->
  <div class="fb-send" 
    data-href="https://www.your-domain.com/your-page.html" 
    data-layout="button_count">
  </div>

</body>
</html>
링크 미리 보기 맞춤 설정

설정

위의 구성 도구에는 보내기 버튼에 대한 모든 설정이 포함되지 않습니다. 다음과 같은 설정도 변경할 수 있습니다.

설정 HTML5 속성 설명 기본값

colorscheme

data-colorscheme

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

"light"

href

data-href

보낼 페이지의 절대 URL입니다.

현재 URL

kid_directed_site

data-kid-directed-site

웹사이트나 온라인 서비스 또는 서비스의 일부가 만 14세 미만의 어린이에게 제공되는 경우 이 설정을 활성화해야 합니다.

"false"

ref

data-ref

50자 미만이어야 하며 영숫자와 일부 구두점(현재 +/=-.:_)을 포함할 수 있는 추적 리퍼럴 레이블입니다. 자세한 내용은 FAQ를 참조하세요.

없음

size

data-size

버튼의 크기로, 현재는 small 크기만 지원됩니다.

small