如何将Facebook的“喜欢”按钮添加到Blogger博客?
我想将the new facebook "like" button添加到我的Blogger网站。如何将Facebook的“喜欢”按钮添加到Blogger博客?
我必须将URL传递给iframe src
中的博客文章。
我可以从<data:post.url/>
获得Blogger发布的网址,但是我不能将它放在src
字符串中,因为Blogger的模板系统很奇怪。
我想这样做:
<iframe allowTransparency='true' frameborder='0' scrolling='no'
src='http://www.facebook.com/plugins/like.php?href=<data:post.url/>&layout=standard&show-faces=true&width=450&action=like&colorscheme=light'
style='border:none; overflow:hidden; width:450px; height:px'/>
但博客抱怨:因为它是没有很好地形成
您的模板无法解析。请确保所有XML元素都已正确关闭。
XML错误消息:属性的“SRC”与元素类型相关的“零”值不得包含“<”人物“
有谁知道这又工作
STEP 1。? :请申请JavaScript SDK到您的模板
第2步:找到这一行<b:includable id='post' var='post'>
第3步:把这个后
<b:if cond='data:post.url'>
<fb:like action='like' colorscheme='light' expr:href='data:post.url' layout='standard' show_faces='false' width='450'/>
</b:if>
保存它和你做;)
更改模板时,我也有同样的错误。于是,我找到了解决方案,通过使用JavaScript函数文件撰写:
<script>
document.write('<iframe src="http://www.facebook.com/plugins/like.php?href=<data:post.url/>&layout=standard&show_faces=true&width=450&action=like&font=verdana&colorscheme=light" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:450px; height:80px"></iframe>');
</script>
只要将上面的代码在您的博客后段的结束。
有两点需要注意:
Irwan的解决方案应该工作(我还没有尝试),但是这意味着FB SDK必须加载。这可能是谁关心博客表现的一个问题。
Maggie的解决方案工作正常,但它不允许单独喜欢这些帖子。
人们可以看到它在这里工作:http://fliscorno.blogspot.com/
我写了一步一步的指导使用wikiHow上的iframe方法: http://www.wikihow.com/Add-Facebook-Like-to-Blogger
让我知道,如果它不为你工作。实际上,您的src需要使用expr:src语法,并使用字符串/数据连接。
JavaScript版本声称更为灵活,但仍有许多人在其浏览器中禁用JavaScript或使用一些NoScript插件。
试试这个,
<iframe allowTransparency='true'
expr:src='"http://www.facebook.com/plugins/like.php?href=" + data:post.url + "&layout=button_count&show_faces=false&width=75&action=like&font=trebuchet+ms&colorscheme=light"'
frameborder='0' scrolling='no'
style='border:none; overflow:hidden; height: 20px'/>
使用本教程中添加类似按钮 - FB已经推出了一个新的设计为类似按钮 - http://www.bloggerplugins.org/2010/04/facebook-like-button-for-blogger.html
胡安·豪尔赫的解决方案应该工作。
恕我直言,使用JavaScript SDK 博客比使用iframe方法(我在我的博客上都试过)要优雅得多。
下面是几个职位我关于这一议题的(包括使用中的属性和这样的,以及如何表达博客纳入使用JavaScript SDK中的类似按钮到您的博客模板)链接:
http://blog.yanivkessler.com/search/label/blogger
希望这有助于...
它从移动设备共享时附加参数m = 1。我如何获得没有任何参数的网址。 – StarWars 2015-04-04 14:46:56
使用'data:post.url.canonical'而不是'data:post.url',因此它是没有查询参数的URL。 – OdraEncoded 2017-01-09 00:40:41