“收藏”按钮

用户可以使用“收藏”按钮将商品或服务收藏到 Facebook 的私密列表中,也可以与好友分享列表或接收相关通知。例如,用户可以收藏想要购买的一件服装、一次旅行或想要访问的一个链接,方便未来消费,或接收关于商品或旅行的促销通知。

“收藏”按钮配置器代码示例设置

分步说明

1.选择“网站链接”

选取您想使用“收藏”按钮的网站链接。

2.代码配置器

将链接粘贴至代码配置器中,然后点击“获取代码”按钮,即可生成“收藏”按钮代码。

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

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

“收藏”按钮配置器

要保存的网站或产品链接
按钮大小

完整代码示例

将代码示例复制粘贴到您的网站。将data-uri 值调整为您的网站链接。下一步,使用 <title> 标签调整“收藏”标题。

<html>
<head>
  <title>Your Website Title</title> 
</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.6";
    fjs.parentNode.insertBefore(js, fjs);
  }(document, 'script', 'facebook-jssdk'));</script>

  <!-- Your save button code -->
  <div class="fb-save" 
    data-uri="http://www.your-domain.com/your-page.html">
  </div>

</body>
</html>
亲身体验一下吧!

设置

除了上述设置外,您还可更改以下设置:

设置 HTML5 属性 说明 默认

uri

data-uri

将被收藏的页面的绝对链接。

当前链接/地址

商品“收藏”按钮

同样可以对商品使用“收藏”按钮:

1.创建商品目录

要对商品使用“收藏”按钮,首先需要创建一份商品目录。

商品目录有时候也称为商品信息库,是您想要在 Facebook 推广的商品的列表。列表中的每件商品均拥有可用于生成广告的特定属性,如商品编号、名称、描述、落地页网址、图片网址、是否有货等。

如何创建商品目录Facebook 动态商品广告

2.Facebook API 编号

前往应用面板的“设置”选项卡,添加开放平台“网站”,并提供网站域名。

3.JavaScript SDK 加载

如下例所示,使用应用编号加载 JavaScript SDK。用应用编号替换 {your-app-id}

<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.6&appId={your-app-id}";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

4.获取商品 URI

通过商务管理平台

为商品使用“收藏”按钮时,您需要用到 2 条信息,即来自商品信息库的商品目录编号和商品编号:

  1. 商务管理平台登录您的业务。
  2. 前往“商务管理平台设置”>“商品目录”。
  3. 点击您想对其使用插件的商品目录。
  4. 在商品目录的名称标题下,记下商品目录编号。示例中的编号是 768856339915012
  5. 所需的其他信息是商品信息库中上传的商品编号。要查看商品信息库的示例,点击商品目录编号。
  6. 在下一页中点击顶部的“商品信息库”。
  7. 点击包含您想使用的商品的提要。
  8. 在下一页,您将看到提要中的商品示例。要让插件识别商品,需要用到在商品信息库中为每个商品列出的商品编号。
  9. 插件 URI 遵循模式 product://<catalog_id >/{retailer_id}。因此,如果我们想为上述示例中命名为 Product #45 的商品设置 URI,它看上去就像这样:product://768856339915012/45其中的商品目录编号来自第 5 步操作

通过图谱 API

您可以通过图谱 API 获得商品 URI。加载一个或多个商品项目时,构建以下网址格式,同时使用目录编号替换 <catalog_id>,使用商品的零售商编号替换 <retailer_id>

product://<catalog_id>/<retailer_id>

请前往商品项目文档了解详情。

5. 商品 URI

在“收藏”按钮代码中,将商品 URI 用作 data-uri。例如,对于商品 URI product://949817451770475/143791832,您的代码应像这样:

<div class="fb-save" 
  data-uri="product://949817451770475/143791832">
</div>

“收藏夹”视图

所有已收藏的链接都将添加至收藏夹视图,网址为 www.facebook.com/saved,如使用移动应用,则导航至更多 -> 收藏夹访问。

示例

收藏夹链接

更改语言

您可以通过加载 Facebook JavaScript SDK 的本地化版本,来更改“收藏”按钮的语言。加载 SDK 时,更改 js.src 的值即可更改语言设置。将 en_US 替换为需要的语言代码,例如代表法语(法国)的 fr_FR

js.src = "https://connect.facebook.net/fr_FR/sdk.js#xfbml=1&amp;version=v2.6";

受支持的语言请参考 Facebook 语言 XML 文件

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