0

我在网站上使用 Pin it 按钮，但是当您使用它时，它只显示图像的截断图标。而在其他任何地方使用按钮，它将显示全尺寸图像。

我正在挖掘我的代码，但找不到解决方案。

任何人都可以帮忙吗？它似乎不适用于 Pin it 按钮或浏览器扩展。

这是该网站的链接：

http://www.slurp.co.uk/red-wine/chilean-red-wine/18173-casillero-del-diablo-cabernet-sauvignon-2010/

代码：

<iframe src="http://d3io1k5o0zdpqr.cloudfront.net/pinit.html?url=http://www.slurp.co.uk/red-wine/chilean-red-wine/18173-casillero-del-diablo-cabernet-sauvignon-2010/&amp;media=http://www.slurp.co.uk/images/products/small/18173.jpg&amp;layout=horizontal" scrolling="no" frameborder="0" style="border-top-style: none; border-right-style: none; border-bottom-style: none; border-left-style: none; border-width: initial; border-color: initial; border-image: initial; width: 90px; height: 20px; "></iframe>

<script type="text/javascript" src="http://assets.pinterest.com/js/pinit.js"></script>
4

2 回答 2

0

请看这里：

http://business.pinterest.com/widget-builder

我们推出了一组新的按钮和小部件，它们应该会有所帮助。

于 2012-12-29T04:46:34.247 回答
0

我认为您需要将该 IFRAME 设置为具有宽度和高度。这些是设置：

+----------------------+-------+--------+
| Orientation-of-Count | Width | Height |
+----------------------+-------+--------+
| Horizontal           | 90px  | 20px   |
| Vertical             | 43px  | 58px   |
| None                 | 43px  | 20px   |
+----------------------+-------+--------+

结合其他您没有询问但可能想知道的事情：

  1. 您无需插入 IFRAME，然后使用 pinit.js。pinit.js 代码的功能是用A指向 pinterest CDN (cloudfront.net) 的 IFRAME 标记替换文档中特别标记的 ANCHOR ( ) 标记。如果要插入具有适当src属性的 IFRAME，则不需要 pinit.js。

  2. src需要对该 IFRAME 属性的查询参数进行编码。特别是，url和media参数中的冒号和斜杠需要进行 uri 编码。在 Javascript 中，您可以使用它encodeURIComponent()来完成此操作。我发现 pinterest 对 URL 的格式有点挑剔，如果你出错了，它会默默地失败。如果您使用包含空格或括号的媒体 URL，我相信它会失败，即使这些是 HTTP URI 的合法字符。页面 URL 也是如此。

  3. 如果您想知道：我不相信您可以消除 IFRAME 的使用。我相信 pinterest 可能正在查看 REFERRER，它可能会默默地拒绝任何未由 cloudfront.net 推荐的 pin/create/button 请求。

于 2012-03-21T18:01:55.903 回答