文档工具支持

网页版“赞”按钮

只需点击“赞”按钮，便可“赞”网页上的一些内容，并将内容分享到 Facebook。您还可在“赞”按钮旁显示一个“分享”按钮，允许用户添加个人消息并自定义分享对象。

“赞”按钮配置器代码示例设置调整语言常见问题

分步说明

1.选择网址或主页

选取您想使用“赞”按钮的网站网址或 Facebook 主页。

2.代码配置器

将网址粘贴到代码配置器，并调整“赞”按钮的 width 等设置。点击 Get Code 按钮生成“赞”按钮代码。

3.复制并粘贴 HTML 代码片段

复制代码片段并粘贴到目标网站的 HTML 中。

4.如有必要，可删除重复内容

如果您已拥有用于激活应用事件记录功能的代码，即可删除所粘贴代码中的 autoLogAppEvents=1 语句，以避免做重复记录。

“赞”按钮配置器

连接“赞”的 URL

Width

布局

standard

操作类型

按钮大小

small

包含“分享”按钮

获取代码

完整代码示例

将代码示例复制并粘贴到您的网站。将 data-href 值调整为您网站的网址。然后使用 og:*** 元标签调整链接预览。og:url 和 data-href 应使用相同的网址。

<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 async defer crossorigin="anonymous" src="https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=v3.0"></script>

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

</body>
</html>

自定链接预览

设置

除了上述设置外，您还可更改以下设置：

设置	HTML5 属性	说明	默认
`action`	`data-action`	显示在按钮上的动词。可以是 `like` 或 `recommend`	`like`
`colorscheme`	`data-colorscheme`	插件使用的配色方案，用于控制按钮上任何文本的颜色。可以是 `light` 或 `dark`。	`light`
`href`	`data-href`	将被“赞”页面的绝对网址。	当前网址。
`kid_directed_site`	`data-kid-directed-site`	如果您的网站或在线服务，或服务的一部分面向不满 13 岁的儿童，您必须启用此设置	`false`
`layout`	`data-layout`	从插件可用的几种布局中选择一种。可以是 `standard`、`button_count`、`button` 或 `box_count` 中的一个。详情请参考常见问题。	`standard`
`ref`	`data-ref`	用于追踪推荐的标签，必须少于 50 个字符，可包含字母数字字符和部分标点（当前有 +/=-.:_）。详情请参考常见问题。	无
`share`	`data-share`	指定是否在“赞”按钮旁显示一个“分享”按钮。这只对 XFBML 版本起作用。	`false`
`size`	`data-size`	此按钮有两种尺寸，即 `large` 和 `small`。	`small`
`width`	`data-width`	插件的宽度（仅限标准布局），受最小宽度和默认宽度限制。详情请查看下文的“布局设置”。	请查看布局设置中的 `standard`

布局设置

选项如下：

布局	默认大小
`standard`	最小宽度：225 像素。默认宽度：450 像素。高度：35 像素（无头像）或 80 像素（有头像）。
`box_count`	最小宽度：55 像素。默认宽度：55 像素。高度：65 像素。
`button_count`	最小宽度：90 像素。默认宽度：90 像素。高度：20 像素。
`button`	最小宽度：47 像素。默认宽度：47 像素。高度：20 像素。

更改语言

您可以通过加载 Facebook JavaScript SDK 的本地化版本来更改“赞”按钮的语言。加载 SDK 时，更改 js.src 的值即可使用语言设置。将 en_US 替换为需要的区域语言代码，例如代表法语（法国）的 fr_FR：

js.src = "https://connect.facebook.net/fr_FR/sdk.js#xfbml=1&version=v7.0";

您可能需要调整社交插件的宽度，以适应不同的语言。请查看本地化与翻译页面查找更多信息。