如何自定义在社交媒体网站上发布网站 URL 时显示的图像
Posted
技术标签:
【中文标题】如何自定义在社交媒体网站上发布网站 URL 时显示的图像【英文标题】：How to customize the Image shown when posting a URL of a website on Social Media sites 【发布时间】：2018-05-20 08:29:37 【问题描述】：我已经看到，当我们放置一个网站的 url 时，该 URL 会出现一个图像。示例包括社交媒体网站，如 Google+、Facebook、Instagram。我需要知道如何将这样的图像添加到我的网站。是否应该应用某个标签或脚本来显示该图像？
当我分享我的网站链接时，我没有得到这样的链接。我需要知道为什么以及如何去做。
【问题讨论】：
【参考方案1】：OG 标签被这些社交网站使用如下：
网站信息 OG 标签开始
<meta property="og:site_name" content="$site_name" />
<meta property="og:url" content="$site_url" />
<meta property="og:type" content="website" />
<meta name="title" property="og:title" content="$the_title" />
<meta name="image" property="og:image" content="$site_logo"/>
<meta property="og:image:type" content="image/png">
<meta property="og:image:width" content="1024">
<meta property="og:image:height" content="1024">
<meta name="description" property="og:description" content="$site_description" />
<meta name="twitter:card" content="summary" />
<meta name="twitter:site" description="@username" />
<meta name="twitter:title" content="$the_title" />
<meta name="twitter:description" content="$site_description" />
<meta name="twitter:image:src" content="$site_logo">
<meta name="twitter:domain" content="$site_url">
网站信息OG标签结束
【讨论】：
【参考方案2】：将以下标签添加到您需要共享的页面的 html 代码的 <head> 部分：
<link rel="image_src" href="image" />
<meta name="twitter:image" property="og:image" content="image" />
并将image替换为页面图片的URL。
当您添加标签时，社交媒体网站仍然可以共享没有图像的页面。这是因为网站缓存页面数据。您需要等待缓存被清理或手动清理（某些网站，例如 Facebook，提供了这种可能性；这是另一个问题的主题）。
【讨论】：
@TheBangBandit 没有。它至少在 Facebook、Twitter、VK.com、OK.ru、Skype、Telegram、Mail.ru、Google+ 和 WhatsApp 中有效。以上是关于如何自定义在社交媒体网站上发布网站 URL 时显示的图像的主要内容，如果未能解决你的问题，请参考以下文章