社交媒体 JavaScript（按钮）与 Google+、Facebook、YouTube 等不兼容

Question

我建立了一个报价混搭。我添加了一堆社交分享按钮。它奏效了。

我决定添加 Google+，但它与其他 JavaScript / HTML 不兼容。所以我注释掉了所有其他社交分享按钮，而 Google+ 按钮仍然不起作用。然后我尝试了一个不同的报价，一个没有 YouTube 视频的报价，一个有 YouTube 视频的报价不显示 Google+ 按钮。这就是我发现的。

切换 YouTube 显示代码确实有帮助，但 Facebook like 现在似乎不起作用，但 Facebook Share 可以，而且我的 OpenGraph 和 Google+ 元数据并不是 100% 售出的。 Facebook 最近更新了他们的按钮，现在我发现“分享”比“喜欢”效果更好。理论上两者都可以在 Google Analytics 中进行跟踪。我希望引用出现在描述中，这对 Facebook 有效，但我无法在 Google+ 上实现。也许我需要更多元数据。我改为 og:type 似乎有帮助的文章。

Quotation Collection

Quotation with Video

Quotation with no YouTube Video

我使用 PHP 构建 JavaScript，但据我所知，Google+ 按钮从元数据中获取所有内容。我的元数据也可能有问题，因为我没有像在this page 上那样干净利落。我已经修改了很多元数据，试图让我的股票看起来最好。我需要 last.fm 来提供更大的图像或重新访问我可以从维基百科中获得的内容。

我的四个按钮都很好 5 个社交分享按钮在我的博客上工作，但我使用了两个插件，Pinterest 按钮可能没有被 Google Analytics 跟踪，但其他四个是。我很确定我昨晚几乎让它工作了，如果你使用 div 和一堆 CSS，li 标签似乎会有所不同，它似乎比使用每个项目中一个按钮的列表更好。

<!-- Professional Share Plugin--><div class="ProfessionalShareBox"><div class="PSBtn"><script type="IN/Share" data-counter="right" data-showzero="true" data-onsuccess="LinkedInShare"></script></div><div class="PSBtn"><a href="https://twitter.com/share" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','http://twitter.com']);" class="twitter-share-button" data-lang="en" data-via="MuskieMcKay"></a></div><div class="PSBtn"><div class="g-plusone" data-size="medium"></div></div><div class="PSBtn"><div class="fb-like" data-href="http://blog.muschamp.ca/2013/11/24/back-from-mexico/" data-send="false" data-width="90" data-layout="button_count" data-show-faces="false" data-action="recommend"></div></div></div><div id="fb-root"></div><div class='yarpp-related yarpp-related-none'>

我可能会切换到不使用有序的按钮列表，并且我也可能会从 Ken 的插件中窃取参数，因为我已经向他提供了如何操作的建议。 ;-) Twitter Cards FTW！

Answer 1

我解决了我的基本问题。我改变了包含 YouTube 视频的方式，从可能基于 iFrame 的包含切换到对象包含。现在我需要调整我的元数据，让它在 Google+ 中显示得更好。我还调整了我的 OpenGraph 和 Twitter Card 元数据，并试图通过各种 API 找到更大的图像。在this blog post 中可以看到我在这方面的最大努力。