웹 플러그인 참고 자료

Messenger 플랫폼은 웹에서 회원님을 방문한 사람과 쉽게 대화를 시작할 수 있는 편리한 웹 플러그인 세트를 제공합니다. 모든 플러그인은 Javascript용 Facebook SDK를 사용하여 구현됩니다.

목차

고객 채팅 플러그인(베타)

Messenger 플랫폼의 고객 채팅 플러그인을 사용하면 Messenger 봇을 웹사이트에 직접 통합하여 Messenger의 개인화된 리치 미디어 경험 그대로 언제든지 고객과 소통할 수 있습니다.

자세한 사용 방법은 고객 채팅 플러그인을 참조하세요.

포함 형식

<div class="fb-customerchat"
 page_id="<PAGE_ID>">
</div>

속성

속성 유형 설명

class

문자열

값은 fb-customerchat이어야 합니다.

page_id

문자열

페이지 ID

ref

문자열

선택 사항.messaging_postbacksmessaging_referrals 이벤트에서 Webhooks로 전달되는 맞춤 이벤트

theme_color

문자열

선택 사항. 고객 채팅 플러그인 아이콘의 배경색 및 사용자가 보내는 메시지의 배경색을 포함하여 플러그인의 주제로 사용될 색상. 흰색을 제외하고 선행 숫자 기호가 있는 모든 16진수 색상 코드(예: #0084FF)를 사용할 수 있습니다. 흰색과 선명하게 대비되는 색상을 선택하는 것이 좋습니다.

logged_in_greeting

문자열

선택 사항. 사용자가 현재 Facebook에 로그인한 경우 표시될 인사말 텍스트. 최대 80자가 허용됩니다.

logged_out_greeting

문자열

선택 사항. 사용자가 현재 Facebook에 로그인하지 않은 경우 표시될 인사말 텍스트. 최대 80자가 허용됩니다.

greeting_dialog_display

문자열

선택 사항. 인사말 대화 상자가 표시되는 방식을 설정합니다. 다음과 같은 값을 사용할 수 있습니다.


  • show: 플러그인을 읽어들일 때는 인사말 대화 상자가 항상 표시됩니다.
  • fade: 플러그인의 인사말 대화 상자가 표시되었다가 사라진 다음 숨겨진 상태로 유지됩니다.
  • hide: 플러그인의 인사말 대화 상자가 사용자가 플러그인을 클릭할 때까지 항상 숨겨집니다.

기본값은 데스크톱의 경우 show, 모바일의 경우 hide입니다.

greeting_dialog_delay

문자열

선택 사항. 플러그인을 읽어들인 후 인사말 대화 상자가 표시될 때까지 지연 시간(초)을 설정합니다. 이 값은 인사말 대화 상자를 표시할 시간을 맞춤 설정하는 데 사용할 수 있습니다.

minimized

부울

사용 중단 알림

이 속성은 이제 사용 중단되었습니다. 플러그인을 맞춤 설정하려면 greeting_dialog_display를 대신 사용하세요. greeting_dialog_delay 속성이 minimized 속성보다 우선합니다.

선택 사항.

  • true true로 설정되면 greeting_dialog_delay = "fade"로 설정하는 것과 효과가 같습니다.
  • false false로 설정되면 greeting_dialog_delay = "show"로 설정하는 것과 효과가 같습니다.

메시지 보내기 플러그인

사용자를 Messenger 대화로 직접 유도하세요.

자세한 사용 방법은 메시지 보내기 플러그인을 참조하세요.

포함 형식

<div class="fb-messengermessageus" 
  messenger_app_id="<APP_ID>" 
  page_id="<PAGE_ID>"
  color="<blue | white>"
  size="<standard | large | xlarge>">
</div>

속성

속성 HTML5 속성 유형 설명

class

문자열

값은 fb-messengermessageus이어야 합니다.

page_id

문자열

페이지 ID

messenger_app_id

번호

Facebook 앱 ID

color

data-color

문자열

버튼 색상: blue 또는 white


기본값: blue

size

data-size

문자열

버튼 크기: standard, large 또는 xlarge


기본값: large

ref

문자열

선택 사항.messaging_postbacksmessaging_referrals 이벤트에서 Webhooks로 전달되는 맞춤 이벤트

Messenger로 보내기 플러그인

백그라운드에서 Messenger 봇이 사용자에게 메시지를 보내고 옵트인하게 합니다.

자세한 사용 방법은 Messenger로 보내기 플러그인을 참조하세요.

포함 형식

<div class="fb-send-to-messenger" 
  messenger_app_id="<APP_ID>" 
  page_id="PAGE_ID" 
  data-ref="<PASS_THROUGH_PARAM>" 
  color="<blue | white>" 
  size="<standard | large | xlarge>">
</div>

속성

속성 유형 설명

class

문자열

값은 fb-send-to-messenger여야 합니다.

page_id

문자열

페이지 ID

messenger_app_id

번호

Facebook 앱 ID

color

문자열

선택 사항. 버튼의 색상: blue 또는 white


기본값: blue

size

문자열

선택 사항. 버튼의 크기: standard, large 또는 xlarge


기본값: large

ref

문자열

선택 사항. 맞춤 상태 매개변수. 최대 250자입니다.


유효한 문자는 a-z A-Z 0-9 +/=-._입니다.


보안상의 이유로 인코딩 및 암호화가 필요합니다.

enforce_login

부울

선택 사항.true일 경우 로그인한 사용자는 버튼을 클릭했을 때 다시 로그인해야 합니다. 기본값: false

상태를 인증과 함께 전달하려면 data-ref 매개변수를 사용하세요. 플러그인을 여러 위치에 표시하는 경우 플러그인이 표시된 위치를 기반으로 상태를 수정해야 할 수 있습니다.

확인란 플러그인

확인란 플러그인을 사용하면 결제 또는 가입 등 양식의 일부로 Messenger 봇을 받아볼 수 있습니다.

자세한 사용 방법은 확인란 플러그인을 참조하세요.

포함 형식

<div class="fb-messenger-checkbox"  
  origin=<PAGE_DOMAIN>
  page_id=<PAGE_ID>
  messenger_app_id=<APP_ID>
  user_ref="<UNIQUE_REF_PARAM>"
  allow_login="<true>"
  size="<small | medium | large | standard | xlarge>"
  skin="<light|dark>"
  center_align="<true|false>">
</div>

속성

속성 유형 설명

class

문자열

값은 fb-messenger-checkbox여야 합니다.

page_id

번호

봇과 연결된 Facebook 페이지 ID

messenger_app_id

번호

Facebook 앱 ID

user_ref

문자열

사용자를 참조하는 고유 매개변수. 최대 250자입니다.


유효한 문자는 a-z A-Z 0-9 +/=-._입니다.

allow_login

부울

선택 사항. 기존 세션이 표시되지 않는 경우 로그인할 수 있도록 합니다. 기본값: true

size

문자열

선택 사항. 플러그인의 크기: small, medium, large, standard, xlarge


기본값: large

skin

문자열

선택 사항. 플러그인 콘텐츠의 색상 테마를 설정합니다. 다음과 같은 옵션을 사용할 수 있습니다.

  • light: 플러그인이 어두운 텍스트로 렌더링됩니다.
  • dark: 플러그인이 흰색 텍스트, 투명한 Messenger 아이콘, 흰색 번개 표시로 표시됩니다.

기본값: light

center_align

부울

선택 사항. 플러그인 콘텐츠를 가운데 정렬할지 선택합니다.


기본값: false