Pinterest分享功能

API：https://developers.pinterest.com/docs/widgets/save/?

首先，请确保在页面上包含了pinit.js脚本。无论使用多少个Pinterest小部件，您都只需在每个页面中包含一次即可。

<script type="text/javascript" async defer data-pin-hover="true"

src="//assets.pinterest.com/js/pinit.js"></script>

页面图片添加属性：

<div class="mate-left">
    <img src="http://76gxho.url.anin.fun/"
         data-pin-url="http://share.anin.fun/1.html"
         data-pin-media="http://76gxho.url.anin.fun/"
         data-pin-description="唐迹景德镇茶具 陶瓷品茗杯主人杯 手工粉彩扒花盖碗整套功夫茶杯套装 宝石蓝粉彩扒花 盖碗*1+公道*1+品茗杯*4">
</div>
<div class="mate-right">
    <img src="http://76hfis.url.anin.fun/"
             data-pin-url="http://share.anin.fun/2.html"
             data-pin-media="http://76hfis.url.anin.fun/"
             data-pin-description="唐迹德化羊脂玉白瓷功夫茶具套装家用客厅手绘盖碗喝茶杯陶瓷茶艺茶具 10头茶壶盖碗江南山水">
</div>

data-pin-url:（必须）分享至Pinterest后点击页面跳转的路径，如下图1；

data-pin-media：（可选）以提供更高质量的图像版本。如果在页面上显示小图像缩略图，但希望固定更高分辨率的版本，可以使用此属性。;

data-pin-description：（可选）图片描述，最多可以包含500个字符，但是在网格视图中只会显示75-100个字符，如下图2.

 

data-pin-hover="true"属性当鼠标移入时可在图片上显示保存悬浮按钮，如下：

data-pin-hover="true"属性当鼠标移入时可在图片上显示保存悬浮按钮，如下：

点击Save后打开Pinterest的分享窗口，可分享至Pinterest如下图：

此外，可以添加自定义的分享按钮，如下：

<a href="https://www.pinterest.com/pin/create/button/"
   data-pin-do="buttonPin"
   data-pin-custom="true"
>
    <input type="button" value="分享" class="button">
</a>

注意：需设置data-pin-custom属性为true，就可使用自定义的标签样式或属性，否则分享按钮将会按照Pinterest默认风格展示。

添加按钮点击后会展示出当前页面所有符合Pinterest规范的图片略缩图，可以点击略缩图的分享按钮分享至Pinterest。如图：

data-pin-do：（可选），根据官方文档，值为buttonBookmark（任何图像）或buttonPin（一个图像）

结论：不能分享图文模式的链接。只能分享图片。