在 Blogger 中使用 XFBML 的 Facebook 点赞按钮 - 无法为每个帖子制作单独的点赞按钮

发布于 2024-09-12 11:42:24 字数 3256 浏览 4 评论 0原文

我正在尝试在我的 Blogger 博客中使用 XFBML 放置 Facebook Like 按钮。我希望它为每个帖子显示不同的按钮,而不是所有博客都显示相同的按钮。

我遵循了此链接中的指南,其中包括: http://hitech-tips.blogspot.com/2010/05/facebook-like-button-xfbml-tutorial.html

发生的情况是显示了“喜欢”按钮,但它是完全相同的按钮对于所有帖子。我读过使用 expr:href='data:post.url' 应该可以解决这个特定问题,但由于某种原因这不起作用。这是所有相关代码,我希望你们能告诉我我做错了什么。

<code>
    // XFBML declaration
    <html expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr' xmlns:fb='http://www.facebook.com/2008/fbml' xmlns:og='http://opengraphprotocol.org/schema/'>

    // Opengraph tags (in head)
    < b:if cond='data:blog.pageType == &quot;item&quot;'>
        < meta expr:content='data:blog.pageTitle' property='og:title'/>
        < meta expr:content='data:blog.url' property='og:url'/>
    < b:else/>
        < meta expr:content='data:blog.title' property='og:title'/>
        < meta expr:content='data:blog.homepageUrl' property='og:url'/>
    < /b:if>
    < meta content='blog' property='og:type'/>
    < meta content='http://lh5.ggpht.com/_4b9fZK142hk/TFHpg-2YeBI/AAAAAAAAEVM/MXLyeL6dvmk/TV%20512x512.jpg' property='og:image'/>
    < meta content='La guía de cine y series' property='og:site_name'/>
    < meta content='MY PROFILE ID IS HERE' property='fb:admins'/>
    < meta content='MY APP ID IS HERE' property='fb:app_id'/>
    < meta content='La guía de cine y series es un blog en español sobre series de TV y películas. Podés encontrar todo tipo de información sobre series de TV y películas: noticias, reviews, previews, trailers, posters y etc.' property='og:description'/>
    < meta content='Ciudad Autónoma de Buenos Aires' property='og:locality'/>
    < meta content='Ciudad Autónoma de Buenos Aires' property='og:region'/>
    < meta content='Argentina' property='og:country-name'/>
    < meta content='MY EMAIL' property='og:email'/>

    // FB Init (in body)
    < div id='fb-root'/>
    < script>
        window.fbAsyncInit = function() {
          FB.init({appId: 'MY_APP_ID', status: true, cookie: true, xfbml: true});
        };
        (function() {
          var e = document.createElement('script'); e.async = true;
          e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
          document.getElementById('fb-root').appendChild(e);
        }());
    < /script>

    // And finally the like button, in the post footer.
    < div class='post-footer-line post-footer-line-3'>
        < div style="margin-top:10px; margin-left:5px;">
            < fb:like action='like' colorscheme='light' expr:href='data:post.url' layout='standard' show_faces='true'/>
        < /div>
    < /div>
</code>

我还在 Facebook 应用程序设置中将基本域设置为 blogspot.com,连接 URL 是以斜杠结尾的博客 URL。

I'm trying to put the Facebook Like button using XFBML in my Blogger blog. I want it to display a different button for each post, not the same for all the blog.

I've followed the guidelines in this link, among others: http://hitech-tips.blogspot.com/2010/05/facebook-like-button-xfbml-tutorial.html

What's happening is that the like button is displayed, but it's exactly the same one for all the posts. I've read that using expr:href='data:post.url' should fix this particular problem, but for some reason this is not working. This is all the relevant code, I hope you guys can tell me what I'm doing wrong.

<code>
    // XFBML declaration
    <html expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr' xmlns:fb='http://www.facebook.com/2008/fbml' xmlns:og='http://opengraphprotocol.org/schema/'>

    // Opengraph tags (in head)
    < b:if cond='data:blog.pageType == "item"'>
        < meta expr:content='data:blog.pageTitle' property='og:title'/>
        < meta expr:content='data:blog.url' property='og:url'/>
    < b:else/>
        < meta expr:content='data:blog.title' property='og:title'/>
        < meta expr:content='data:blog.homepageUrl' property='og:url'/>
    < /b:if>
    < meta content='blog' property='og:type'/>
    < meta content='http://lh5.ggpht.com/_4b9fZK142hk/TFHpg-2YeBI/AAAAAAAAEVM/MXLyeL6dvmk/TV%20512x512.jpg' property='og:image'/>
    < meta content='La guía de cine y series' property='og:site_name'/>
    < meta content='MY PROFILE ID IS HERE' property='fb:admins'/>
    < meta content='MY APP ID IS HERE' property='fb:app_id'/>
    < meta content='La guía de cine y series es un blog en español sobre series de TV y películas. Podés encontrar todo tipo de información sobre series de TV y películas: noticias, reviews, previews, trailers, posters y etc.' property='og:description'/>
    < meta content='Ciudad Autónoma de Buenos Aires' property='og:locality'/>
    < meta content='Ciudad Autónoma de Buenos Aires' property='og:region'/>
    < meta content='Argentina' property='og:country-name'/>
    < meta content='MY EMAIL' property='og:email'/>

    // FB Init (in body)
    < div id='fb-root'/>
    < script>
        window.fbAsyncInit = function() {
          FB.init({appId: 'MY_APP_ID', status: true, cookie: true, xfbml: true});
        };
        (function() {
          var e = document.createElement('script'); e.async = true;
          e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
          document.getElementById('fb-root').appendChild(e);
        }());
    < /script>

    // And finally the like button, in the post footer.
    < div class='post-footer-line post-footer-line-3'>
        < div style="margin-top:10px; margin-left:5px;">
            < fb:like action='like' colorscheme='light' expr:href='data:post.url' layout='standard' show_faces='true'/>
        < /div>
    < /div>
</code>

I've also set the base domain as blogspot.com in the Facebook Application Settings, and the Connect URL is the blog URL ending with a slash.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

五里雾 2024-09-19 11:42:24

好的,现在它可以工作了,我不确定到底是什么解决了它,但它必须是这些选项之一或所有这些选项一起:

  • 我已将 OpenGraph 类型从 url 更改为文章。

  • 我已将 Facebook 的“应用程序设置”页面中的基本域设置为 blogspot.com

另一种可能性是,它是一直在工作,但它并没有刷新我已经点击过的按钮,即那些在更改后实际起作用的按钮,因为当我发布一篇新帖子时,我意识到对于新帖子来说,它正在工作。

无论如何,遵循本教程应该会有所帮助:

http://forum.developers.facebook。 com/viewtopic.php?id=58903

Ok, now it's working, I'm not sure exactly what fixed it, but it must be one of these options or all of them together:

  • I've changed the OpenGraph type from url to article.

  • I've set the base domain in the Applications Settings page in Facebook to blogspot.com

The other posibility is that it was working all along, but it didn't refreshed the buttons that I've already clicked, of the ones that were already there after the change that actually worked, because when I posted a new post I've realized that for the new one it was working.

Anyway, following this tutorial should help:

http://forum.developers.facebook.com/viewtopic.php?id=58903

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文