当我们分享这样的链接时,我们如何在我们的网站中包括一张图片来显示在WhatsApp上?


当前回答

因为在这一点上,这个问题几乎是一个支持小组,为那些因各种原因而遭受WhatsApp不加载图像预览的人提供支持,下面是我的情况的根本原因,希望它最终能帮助到一些人:

确保元标记og:image内容链接使用HTTPS

当我通过https使我的网站可用时,我忘记了具体地将元标签从http更改为https。除了WhatsApp,其他所有社交媒体预览版都对这张照片进行了处理。

简单地让它https固定它为我。

其他回答

我尝试了这个线程下的几个建议,从我的外部搜索,但这对我来说是一个完全不同的问题。我使用og:image标记所指示的图像的特定指令正在被Jetpack插件提供的open graph标记所覆盖。你可以在这里找到我的详细答案。然而,我认为有必要在这个更多人关注的帖子中简要地添加这些步骤。希望这能帮助到一些人。

Facebook共享调试器帮助我确定了根本原因,从那里,我遵循以下步骤:

Debug your website using the debugger above. Simply type in the URL and hit debug. This should give you a list of warnings and once you scroll down to the open graph tags sections, you will be able to see the values that are being fetched for your website. The one to focus on is the og:image tag. Scroll further down to the "See exactly what our scraper sees for your URL" link and search for the og:image tag to find the villain in your story. Now simply, opt the means to remove an override that is occurring. In my case, I found the following function helpful. It changes the default image used any time Jetpack can not determine an image to use.

它改变默认图像使用任何时候,Jetpack不能确定一个图像使用

function custom_jetpack_default_image() {
    return 'YOUR_IMAGE_URL';
}
add_filter( 'jetpack_open_graph_image_default', 'custom_jetpack_default_image' );

需要补充的是,建议图像参数最小为300px x 200px,大小< 300kb。如果这些一般的说明对你不起作用,请遵循这些说明,因为,那么你的问题很可能与我的问题相似。此外,有时最简单的解决方案可能只是删除插件(只要你验证你可以没有它)。

最后你应该能看到像这样的东西

希望这能有所帮助。

NS

即使在这些尝试之后。我的网站图片有时会被取走,有时不会。 在https://developers.facebook.com/tools/debug/sharing验证后

意识到我的django (python)框架是渲染图像路径相对。我必须用完整的url更改图像的路径。(包括http://)。然后它开始工作了

在一个bug中工作后,发现在IOS中,HEAD中的元素可能会阻止WhatsApp搜索og:image /og:description / name=description。所以首先试着把它们放在其他事情的上面。

这行不通

<head>
    <div id='hidden' style='display:none;'><img src="http://cdn.some.com/random.jpg"></div>

    <meta property="og:description" content="description" />
    <meta property="og:image" content="http://cdn.some.com/random.jpg" />
</head>

这项工作:

    <head>
        <meta property="og:description" content="description" />
        <meta property="og:image" content="http://cdn.some.com/random.jpg" />

        <div id='hidden' style='display:none;'><img src="http://cdn.some.com/random.jpg"></div>
    </head>

我建议经常查看https://developers.facebook.com/tools/debug/sharing以验证您的属性为 Facebook经常改变它的政策、法规和API。

如果你使用Messenger机器人或其他FB应用程序,你可能需要FB:app_id属性来让链接图像在Whatsapp中工作。 更多信息请访问Facebook开发者网站。 https://developers.facebook.com/docs/sharing/webmasters

如果你想在某人在WhatsApp上分享的你网站的url旁边放一张照片,你必须在url链接的页面上放一个元标签,就像这样:

<meta property="og:image" content="http://unrestrictedstock.com/wp-content/uploads/Unrestricted-Stock-Small.png"/>