html - Facebook Open graph tags for blogger - OG 图片太小。我可以指定全尺寸图像而不是缩略图吗?

标签 html facebook templates facebook-graph-api blogger

Blogger 不允许您在每篇博文中指定一个开放图表图像。目前,模板中有一段代码将自动生成的缩略图指定为facebook 的打开图图像。问题是,缩略图是 72*72,Facebook 现在要求 OG 图像至少有 200px 的宽度,或者它默认为页面上符合标准的第一张图像,即我的标题图像。

我的问题是:我可以在我的模板中修改这段代码以指定帖子中的全尺寸图像而不是生成的缩略图吗?如果是这样,如何?如能提供帮助,万分感谢!

最佳答案

我知道这是一个老问题(2 年前),但我希望我的回答可以帮助其他正在寻找解决方案的人。

目前,我们正在使用此代码在 Facebook 上共享链接时创建缩略图:

<meta expr:content='data:blog.postImageThumbnailUrl' property='og:image'/>

Blogspot 将生成如下所示的 HTML 代码:

<meta property="og:image" content="http://1.bp.blogspot.com/-t5-HTAnnThU/Vicp0SSNPeI/AAAAAAAACZw/9lbrjwRY64A/s72-c/get-free-xyz-domain.png" />

是的,如您所说,它是一张 72x72 的图片。但是您知道我们可以根据图片 URL 更改图片大小吗?

当您替换 s72-c 时至 w600-h315-c (600x315):

Thumbnail

现在,问题是我们如何替换新链接?我使用了以下技巧:

<meta expr:content='"http://junookyo.freevnn.com/?img=" + data:blog.postImageThumbnailUrl' property='og:image'/>

这是简单的 PHP 代码:

<?php

if (isset($_GET['img']) && filter_var($_GET['img'], FILTER_VALIDATE_URL)) {

    $img = $_GET['img'];

    if (strpos($img, '/s72-c/') !== FALSE) {

        $img = str_replace('/s72-c/', '/w600-h315-c/', $img);

        header("Location: {$img}");

    }

}

exit;

最终结果:

enter image description here

阅读my blog post了解更多详情。

关于html - Facebook Open graph tags for blogger - OG 图片太小。我可以指定全尺寸图像而不是缩略图吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20133936/

相关文章:

javascript - Bootstrap 按钮在表格中不起作用

html - 为什么会存在 ID?

html - 砌体中的中心图像

php - 如何使用他们的 API 获取 Facebook 上共同好友的列表?

facebook - 如何在本地进行 Facebook Messenger Bot 开发?

c++ - 在 C++ 中使用在其他文件中声明的模板

html - 灵活的 'container' -div

Android : Failed to find provider info for com. facebook.wakizashi.provider.PlatformProvider

c++ - 在 C++ 中模板化友元

c++ - 指针的函数模板特化