Question

Blogger有一些用于获取帖子图片的布局数据标签，例如data:blog.postImageUrl（提取帖子中第一张图片的网址）和data:blog.postImageThumbnailUrl（生成70×70像素）您帖子中第一张图片的缩略图，在Facebook / Twitter /等分享时太小而无法使用。）

但是，在发布帖子时，Blogger会自动使用帖子中的第一张图片，使用特别调整大小和/或裁剪的图片版本生成自己的og:image元标记。重要的是，此生成的图片会忽略您对帖子图片所做的任何自定义调整大小或裁剪，方法是修改其网址s1600中的w180，然后返回一张非常适合分享的大尺寸图片社交媒体网站。（根据Facebook的“explained here”的建议，它甚至将图像缩小到1.91：1的比例。）

以下是一个例子：

原始图片网址（尺寸：600×450 :)
Best Practices

使用自定义尺寸值w1200-h630-p-k-no-nu调整尺寸的图像（最大宽度为180像素）：
https://1.bp.blogspot.com/-rEPYMMK3vT0/WaVHqLSY7-I/AAAAAAAAA2A/CVMWqg18oU8HEIyo3r3CWrcO8Bm7O4uiwCLcBGAs/s1600/Montreal-Biodome-exterior.jpg

这是Blogger自动生成的图像（裁剪为600×315）： https://1.bp.blogspot.com/-rEPYMMK3vT0/WaVHqLSY7-I/AAAAAAAAA2A/CVMWqg18oU8HEIyo3r3CWrcO8Bm7O4uiwCLcBGAs/w180/Montreal-Biodome-exterior.jpg

请注意自动生成的图片如何使用自己的尺寸值w180，完全忽略我指定的twitter:image。

对我来说，问题是我也使用Twitter的“大图像摘要卡”。我尝试使用Blogger数据标记指定用于<meta expr:content='data:blog.postImageThumbnailUrl' name='twitter:image'/> OR <meta expr:content='data:blog.postImageUrl' name='twitter:image'/>卡元标记的图像网址，如下所示：

postImageThumbnailUrl

除了顶部提到的第一个（data:blog.postImageUrl）太小而不是70×70像素，而第二个（w180）使用自定义的大小值获取图像URL twitter:image，返回的图像只有180像素宽 - 就像在Twitter上分享一样无用（生成的Twitter卡使用空白占位符图像）。

我现在所做的就是完全删除og:image标记，这会强制Twitter使用twitter:image标记，以便链接共享起作用。但是，如果可能的话，我更愿意将w1200-h630-p-k-no-nu标记与正确的图像数据标记一起使用。

所以这是我的问题：有谁知道数据标记是什么（如果存在），以获取Blogger为每个标记生成的帖子图片的大型裁剪<meta expr:content='data.{ETC}' name='twitter:image'/>版本张贴？像这样：

<meta content='https://1.bp.blogspot.com/-rEPYMMK3vT0/WaVHqLSY7-I/AAAAAAAAA2A/CVMWqg18oU8HEIyo3r3CWrcO8Bm7O4uiwCLcBGAs/w1200-h630-p-k-no-nu/Montreal-Biodome-exterior.jpg' name='twitter:image'/>

其中，在使用上述图片的帖子中，将呈现为：

std::string

Answer 1

感谢Prayag Verma指向回答了此问题的similar existing question。使用resizeImage operator，我将以下代码实现到我的模板中：

<b:if cond='data:blog.postImageUrl'>
  <meta expr:content='resizeImage(data:blog.postImageUrl, 1200, "40:21")' name='twitter:image'/>
</b:if>

其中，在帖子的来源中，呈现为：

<meta content='https://1.bp.blogspot.com/-rEPYMMK3vT0/WaVHqLSY7-I/AAAAAAAAA2A/CVMWqg18oU8HEIyo3r3CWrcO8Bm7O4uiwCLcBGAs/w1200-h630-p-k-no-nu/Montreal-Biodome-exterior.jpg' name='twitter:image'/>

这正是我想要得到的。它以优异的颜色传递Twitter Validator。问题解决了。

哪个Blogger模板数据标记可以获取原始的，未显示的帖子图片？

1 个答案: