Question

我一直在使用4.7.3 Wordpress安装，并创建了一个自定义pinterest分享按钮，放置在我的页脚中，其中已经有其他社交分享图标，例如：

<div class="mysharingclass">
<a href="https://www.facebook.com/sharer/sharer.php?u=<?php echo the_permalink() ?>" target="_blank"><i class="icon-facebook"></i></a>
<a  href="https://twitter.com/intent/tweet?text=<?php echo urlencode( the_permalink() ) ?>" target="_blank"><i class="icon-twitter"></i></a>
</div>

现有的社交分享网址/图标工作得很好，如上所述，我刚刚收到了一个如下内容：

<?php $pinterestimage = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'full' ); ?>
<a href="//pinterest.com/pin/create/%20button?url=<?php echo urlencode(get_permalink($post->ID)); ?>&media=<?php echo $pinterestimage[0]; ?>&description=<?php the_title(); ?>" data-pin-custom="true" target="_blank"><i class="icon-pinterest"></i></a>

虽然icon-pinterest已添加到我的主题中，但style.css中显示如下：

[class^="icon-"], [class*=" icon-"] {
    font-family: 'my-icons';
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.icon-pinterest:before {
  content: "\e918";
}

您可能已经注意到，而不是在URL中使用：

http://pinterest.com/pin/create/button/?url

我宁愿打电话：

//pinterest.com/pin/create/%20button?url

显然，当您想要包含自己的自定义按钮并绕过调用pinit.js时，这似乎是正确的URL。结果是共享URL正常工作，但它显示“Missing Href”错误，如下面的屏幕截图所示：

我非常困惑，因为我没有看到我的共享代码有任何问题，这是我通过检查元素看到的：

<a href="//pinterest.com/pin/create/%20button?url==http%3A%2F%2Flocalhost%2Fmywebsite%2Findex.php%2F2017%2F04%2F16%2Fhello-world%2F&amp;media=&amp;description=Hello world!" data-pin-do="buttonPin" data-pin-custom="true" target="_blank"><i class="icon-pinterest"></i></a>

我还必须说，如果我在Chrome中多次刷新，有时错误会消失，但如果我使用的是Firefox或Safari，则会一直存在。

我很困惑，我不明白它到底发生了什么，以及我在哪里发生了可怕的错误，所以任何帮助都会非常感激。我唯一的提示就是pinit.js弄乱了我自己的自定义按钮。事实上，我已经在我的header.php中包含以下内容，以便在我的Wordpress帖子中启用嵌入引脚：

<script
        type="text/javascript"
        async defer
        src="//assets.pinterest.com/js/pinit.js"
    ></script>

当我评论出来时，丢失的href错误消失了（因此js不是“接管”我的自定义按钮），但是后来我失去了在帖子中嵌入别针的能力（按照：{{3} }）和pinterest链接返回一个空白页面（这是生成的当前URL：https://developers.pinterest.com/tools/widget-builder/?）。我需要保留在文章中嵌入引脚的能力以及通过共享页脚固定我的文章的能力。怎么可能？你能帮忙吗？我不知道如何进一步采取这一点，不幸的是我不能丢弃这两个功能中的一个，因此需要一个涵盖两者的解决方案。

非常感谢你。

EDIT1：我已经开始怀疑pinit.js是否包含在正确的位置，所以我在</body>结尾之前包含在我的footer.php中讨论https://www.pinterest.com/pin/create/%20button/?url=%3Dhttp%3A%2F%2Flocalhost%2Fmywebsite%2Findex.php%2F2017%2F04%2F16%2Fhello-world%2F&media=&description=Hello%20world!与<head>部分中的 header.php 放在一起的问题相同，即功能有效，但UI错误说“缺少href”仍然出现。经过一番摆弄后，我已经删除了异步延迟并尝试了这两种选择，一个接一个：

<script type=”text/javascript” src=”//assets.pinterest.com/js/pinit.js”></script>

和

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

UI错误消失了，我返回了以下网址：

https://www.pinterest.com/pin/create/%20button/?url=%3Dhttp%3A%2F%2Flocalhost%2Fmywebsite%2Findex.php%2F2017%2F04%2F16%2Fhello-world%2F&media=&description=Hello%20world!

然而，URL返回一个空白屏幕，为什么？

感谢您的帮助。

创建自定义Pinterest共享按钮：pinit.js的问题？

0 个答案: