og:image 在图像 URL 由 php 动态生成时被忽略
og:image being ignored when image URL is generated dynamically by php
我有一个网页(在 Wordpress 下),我想根据查询字符串参数在 Facebook 帖子中显示不同的预览图像。
为此,在我的 <head>
标签中,我有:
<?php
$image = wp_get_attachment_image_src( get_post_thumbnail_id( $_GET['lbcid'] ), 'single-post-thumbnail' );
?>
<meta property="og:url" content="http://uat1.one-pager.sugarloafculinary.com/?lbcid=6957" />
<meta property="og:type" content="article" />
<meta property="og:title" content="Test Title" />
<meta property="og:description" content="Description Here" />
<meta property="og:image" content="<?php echo $image[0] ?>" />
$image[0]
输出有效的 URL,但当 content
属性的值由 [= 动态输出时,Facebook 似乎完全忽略了 <meta>
标签41=]。相反,它会选择页面上符合要求的第一个图像。我已经进入FB调试工具并重新抓取 - 这没有效果(在这个问题上)。
当我对 content
属性的值进行硬编码时,它会按预期显示。例如:
<meta property="og:image" content="http://uat1.one-pager.sugarloafculinary.com/wp-content/uploads/2018/07/blog_bulgar-pudding.jpg" />
您可以在 http://uat1.one-pager.sugarloafculinary.com/?lbcid=6957. If you view the source, you'll see that there is a valid (dynamically generated) URL for an image in that <meta>
tag, but if you test the page in the FB Sharing Debugger 看到这个动作,您会看到指定的图像没有显示。
任何人都可以看到我的代码中的任何错误吗?有什么技巧可以让它发挥作用吗?这可能是 Wordpress 的事情吗? (我没有在 WP 之外测试过)。
编辑:
请参阅下面已接受的答案。上面 URLs 处的代码已被修改以解决问题,因此它们将不再说明问题。简单的解决方案:FB scraper 似乎停在 og:image 的第一个实例,其中我的是第二个,因此被忽略了。
使用 facebook 调试器 https://developers.facebook.com/tools/debug 似乎图像已成功生成并且 facebook 可以读取它
<meta property="og:image" content="http://uat1.one-pager.sugarloafculinary.com/wp-content/uploads/2018/06/logo_horz1-e1530285280453.png" />
<!--this image is less than 200*200px -->
调试器告诉的错误是图像小于 200px * 200px
如果您使用更大的图像将解决问题
EDIT: after I revised the code I found MANY generated og:image
on
code
FB takes first one and ignores the rest. first og:image
is small so
error occures
revise your plugins and theme to eliminate unwanted og:image
我有一个网页(在 Wordpress 下),我想根据查询字符串参数在 Facebook 帖子中显示不同的预览图像。
为此,在我的 <head>
标签中,我有:
<?php
$image = wp_get_attachment_image_src( get_post_thumbnail_id( $_GET['lbcid'] ), 'single-post-thumbnail' );
?>
<meta property="og:url" content="http://uat1.one-pager.sugarloafculinary.com/?lbcid=6957" />
<meta property="og:type" content="article" />
<meta property="og:title" content="Test Title" />
<meta property="og:description" content="Description Here" />
<meta property="og:image" content="<?php echo $image[0] ?>" />
$image[0]
输出有效的 URL,但当 content
属性的值由 [= 动态输出时,Facebook 似乎完全忽略了 <meta>
标签41=]。相反,它会选择页面上符合要求的第一个图像。我已经进入FB调试工具并重新抓取 - 这没有效果(在这个问题上)。
当我对 content
属性的值进行硬编码时,它会按预期显示。例如:
<meta property="og:image" content="http://uat1.one-pager.sugarloafculinary.com/wp-content/uploads/2018/07/blog_bulgar-pudding.jpg" />
您可以在 http://uat1.one-pager.sugarloafculinary.com/?lbcid=6957. If you view the source, you'll see that there is a valid (dynamically generated) URL for an image in that <meta>
tag, but if you test the page in the FB Sharing Debugger 看到这个动作,您会看到指定的图像没有显示。
任何人都可以看到我的代码中的任何错误吗?有什么技巧可以让它发挥作用吗?这可能是 Wordpress 的事情吗? (我没有在 WP 之外测试过)。
编辑:
请参阅下面已接受的答案。上面 URLs 处的代码已被修改以解决问题,因此它们将不再说明问题。简单的解决方案:FB scraper 似乎停在 og:image 的第一个实例,其中我的是第二个,因此被忽略了。
使用 facebook 调试器 https://developers.facebook.com/tools/debug 似乎图像已成功生成并且 facebook 可以读取它
<meta property="og:image" content="http://uat1.one-pager.sugarloafculinary.com/wp-content/uploads/2018/06/logo_horz1-e1530285280453.png" />
<!--this image is less than 200*200px -->
调试器告诉的错误是图像小于 200px * 200px 如果您使用更大的图像将解决问题
EDIT: after I revised the code I found MANY generated
og:image
on codeFB takes first one and ignores the rest. first
og:image
is small so error occuresrevise your plugins and theme to eliminate unwanted
og:image