如何绕过Facebook的opengraph标签(如按钮)并使用data-href代替 [英] How to bypass opengraph tags for Facebook like buttons and use data-href instead
问题描述
在我的<body>标记之后，我安装了带有fb-root div的javascript代码.
I have the javascript code with the fb-root div installed right after my <body> tag.
我的网站标题中有一个喜欢按钮，以使网站喜欢.
There's a like button in the header of my website to like the website.
但是，对于每篇文章，网站上都有更多按钮.有时在同一页面上有多个.
But there's more buttons on the website, for every article. Sometimes there's more than one on the same page.
因此，按照facebook的文档说明，我在fb-like标签中添加了data-href=""属性.没有工作.然后，我添加了一个ref=""属性，其中包含了文章的标签.以为会有所帮助.
So following facebook's docs instructions I added a data-href="" attribute to my fb-like tag. Didn't worked. Then I added a ref="" attribute with the article's slug inside it. Thought it would help.
同时具有data-href和ref属性的按钮显示与网站标题相同的赞数量.当我单击它们时，它们都喜欢相同的URL，而不是我在data-href中指定的URL.任何按钮始终使用opengraph标记中的数据，并且完全忽略我在标记中指定的内容. (应该相反)
The button with both data-href and ref attributes shows the same amount of likes as the website header's one. And when I click on them they both like the same url, not the url I specified in data-href. Any button ALWAYS uses data from the opengraph tags and completely ignores what I specify in the tag. (Which should be the opposite)
所以问题是:是否可以绕过OG标签并强制将data-href中的URL用作按钮? (它应该以这种方式工作，但我完全忽略了为什么不这样做).
So the question is: Is there a way to bypass OG tags and force the URL from data-href to be used for a button? (It should work that way but I totally ignore why it doesn't).
这是我使用的代码:
紧接着:
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&appId=MY_API_KEY>";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
然后在标题中:
<div class="fb-like" data-send="false" data-layout="button_count" data-width="100" data-show-faces="false" data-font="arial" data-colorscheme="light"></div>
然后在文章中:
<div class="fb-like" data-href="URL_OF_THE_ARTICLE" data-send="false" data-layout="button_count" data-width="175" data-show-faces="false" data-font="arial" data-colorscheme="light"></div>
我尝试同时使用fb:和div标签.这应该非常简单，就像Twitter和Google+一样.
I tried using both fb: and div tags by the way. This should be really simple, as it has been for Twitter and Google+.
任何人都知道这是怎么回事?
Anyone has an idea of what's wrong with that?
谢谢！
推荐答案
喜欢"按钮的data-href参数应指向您要喜欢/共享的内容的URL-
The like button's data-href param should point to the URL of the content you want to like/share -
该URL应该包含告诉Facebook标题的元标记，等等，然后将这些标记返回给Facebook的抓取工具
That URL should contain the meta tags telling facebook what title, etc to display and return these tags to Facebook's crawler
使用 Facebook的调试工具，您可以查看Facebook在该URL上检测到的内容–再次检查您不会通过更改og:url标签，使用规范的meta标签等来重定向抓取工具
You can see what facebook detects at that url with Facebook's Debug Tool - double-check you're not redirecting the crawler by changing the og:url tag, using a canonical meta tag, etc
这篇关于如何绕过Facebook的opengraph标签(如按钮)并使用data-href代替的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
