HTML 设置 Facebook 图像

标签 html facebook meta

免责声明: 我已经用谷歌搜索过并在这里阅读了一些问答,所以请避免这些建议。

问题: 我正在尝试设置当 FB 上提到我的网站的网址时显示的图像,如下所示:

<head>
    <meta property="og:image" content="http://example.com/image/theImage.jpg"/>
    <link rel="image_src" href="http://example.com/image/theImage.jpg"/>
</head>

它不起作用!

Facebook 所选的图像位于正文部分,如下所示:

<img src="images/Jil.jpg" alt="Jil" class="img-responsive">

更奇怪的是,所选图像不是第一个 <img>标签在正文部分,所以我不明白facebook如何选择要显示的图像的逻辑

最佳答案

在调试此类 Facebook 标记问题时,值得使用调试页面:https://developers.facebook.com/tools/debug/

在这种情况下,听起来好像它告诉您图像尺寸太大。

此外,验证您的 HTML 总是好的,因为可能适用于浏览器的内容可能不适用于 Facebook 用于解析 HTML 服务器端的内容。 (问题中的 HTML 很好,我只是为将来找到这个答案的人提供这个建议。)

关于HTML 设置 Facebook 图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43315171/

相关文章:

HTML5 元验证

html - Google Article Rich Snippet 的 'mainEntityOfPage' 微数据标记

javascript - div.getelementbyid(id).innerHTML = ""给出错误

登录时出现 JavaScript 错误

javascript - iPhone 上的 Facebook Instant Articles 中的内联视频播放

iphone - 如何使用 Graph api 将图像与文本一起发布?

html - 从 HTML 页面重定向

html - Semantic-UI UI 类的使用

javascript - 滚动轮播时需要出现文字

javascript - 在我执行 git rebase 后,应该只有一次提交