0

Pinterest 适用于单个照片图像，而不是网页 URL。Twitter 和 Facebook 可以只使用页面 URL，但对于 Pinterest，每个单独的图像 URL 都应该提供给“Pin It”按钮链接而不是页面 URL。

我正在尝试将 Pin It 按钮添加到 prettyPhoto 插件中，到目前为止一切都已设置，除了我不知道如何获取幻灯片中每个单独图像的 img src 和标题，以便将它们附加到“Pint它”链接。

我目前在 jquery.prettyPhoto.js 中的 facebook 代码之后立即拥有的内容：

<div class="pinterest">
    <a href="http://pinterest.com/pin/create/button/?url='+window.location.href+'&media='+$('#fullResImage').attr('src')+'&description='+$(this).attr('title')+'" class="pin-it-button" count-layout="horizontal" target="_blank">
        <img border="0" src="http://assets.pinterest.com/images/PinExt.png" title="Pin It" />
    </a>
</div>

但是由于某种原因， $('#fullResImage').attr('src')和$(this).attr('title')都不能正常工作。你可以在这里查看页面，脚本在这里。它们是“未定义的”并且是空的。

有人可以帮我让他们工作吗？非常感谢！

4

4 回答 4

1

我不确定上述解决方案是如何起作用的，因为{path}在settings.social_tools.

唯一的方法是声明一个全局并根据大小写（图像/视频/等）为其分配媒体 url，最后更新.pp_socialdiv

我相信它可以做得更优雅，但这更像是一个快速补丁，它只是工作。

对于正在寻找解决方案的其他人，这是修改后的 prettyphoto javascript

于 2013-02-06T09:44:15.010 回答
1

众所周知，Pinterest 是针对个人照片图像而不是网页 URL，所以我们需要做一些不同的事情，比如

<a href="http://pinterest.com/pin/create/button/?url='+encodeURIComponent(location.href.replace(location.hash,""))+'&media={path}&description={title}" class="pin-it-button" count-layout="horizontal" target="_blank">
    <img border="0" src="http://assets.pinterest.com/images/PinExt.png" title="Pin It" />
</a>

这在漂亮的照片库上不起作用，所以现在这是解决方案，

当我们初始化漂亮照片时，我们必须使用 script.js 中的代码。

像这样，代码

$(document).ready(function(){
    $(‘.prettyPhoto’).prettyPhoto({
        changepicturecallback: onPictureChanged,
    });

    function onPictureChanged() {

    var href= “http://pinterest.com/pin/create/button/?url=”‘+ encodeURIComponent(location.href.replace(location.hash,”&quot;)) +’”&amp;media=”+$(‘#fullResImage’).attr(‘src’);

    jQuery(‘.pp_social’).append(“&lt;div class=’pinterest’ ><a href=’”+ href +”‘ class=’pin-it-button’ count-layout=’horizontal’ target=’_blank’&gt;<img border=’0′ src=’http://assets.pinterest.com/images/PinExt.png’ title=’Pin It’ /></a></div>”);
}

有关完整说明，请访问我的教程页面。

将 Pinterest 添加到 prettyPhoto 中的社交媒体图标

我相信它会对你有很大帮助。

谢谢

于 2013-07-26T10:11:19.753 回答
1

这是唯一可行的方法。

不要为图像使用 ID，因为每次您要固定图像时，每次在您的网页上使用带有 ID 的第一张图像。

请参阅下面的代码：

$('.prettyPhoto').prettyPhoto({ changepicturecallback: onPictureChanged, });

function onPictureChanged() {

  var href= "http://pinterest.com/pin/create/button/?url=" + encodeURIComponent(location.href.replace(location.hash,"")) +"&media="+$('#pp_full_res').find('img').attr('src');

  jQuery('.pp_social').append("<div class='pinterest' ><a   href='"+ href +"' class='pin-it-button' count-layout='horizontal' target='_blank'><img border='0' src='http://assets.pinterest.com/images/PinExt.png' title='Pin It'/></a></div>");

}
于 2015-05-21T10:04:44.943 回答
0

将代码更改为此，它现在可以工作：

<div class="pinterest">
    <a href="http://pinterest.com/pin/create/button/?url='+encodeURIComponent(location.href.replace(location.hash,""))+'&media={path}&description={title}" class="pin-it-button" count-layout="horizontal" target="_blank">
        <img border="0" src="http://assets.pinterest.com/images/PinExt.png" title="Pin It" />
    </a>
</div>
于 2012-11-22T07:24:54.583 回答