如何在我的网站上添加社交元标签?

我运营着这个网站:https://www.graphicdesignforum.com

每当我在社交媒体(Facebook、Twitter、LinkedIn)上分享帖子时,由于缺少社交媒体元标签(如 og:image、og:description,特别是 Twitter Cards 相关的元标签),帖子看起来空荡荡的。我希望我的帖子能像下方附带的示例图片那样,显示图片、标题和描述。

我想知道是否在 Discourse 引擎中遗漏了某个设置可以配置此项,或者是否有可用的插件能提供此类功能。

您可以在这里测试您的网站在 Twitter 上的显示效果:https://cards-dev.twitter.com/validator
并在此处阅读关于 Open Graph 协议的介绍:https://ogp.me/

然而,如果你查看 这个话题 的源代码,Ivan,你会看到什么呢?:eyes:

<meta name="twitter:card" content="summary" />
<meta name="twitter:image" content="https://d11a6trkgmumsb.cloudfront.net/optimized/3X/d/2/d2e36f2af9cebf5ca3144c0c882c5f35efbceeb1_2_526x500.jpeg" />
<meta property="og:image" content="https://d11a6trkgmumsb.cloudfront.net/optimized/3X/d/2/d2e36f2af9cebf5ca3144c0c882c5f35efbceeb1_2_526x500.jpeg" />
<meta name="twitter:url" content="https://meta.discourse.org/t/how-to-add-social-meta-tags-to-my-site/134111" />
<meta property="og:title" content="How to add social meta tags to my site?" />
<meta name="twitter:title" content="How to add social meta tags to my site?" />
<meta property="og:description" content="I’m running this site: https://www.graphicdesignforum.com  Whenever I share a post on social media (Facebook, Twitter, Linkedin), the post looks barren without the social media meta tags, such as og:image, og:description, and more specifically twitter cards. related meta tags. I wish my posts looked like the attached example image below with an image, title, description.    I wonder if I’m missing a setting in the Discourse engine where I could set this up, or if there is a plug-in I could add t..." />
<meta name="twitter:description" content="I’m running this site: https://www.graphicdesignforum.com  Whenever I share a post on social media (Facebook, Twitter, Linkedin), the post looks barren without the social media meta tags, such as og:image, og:description, and more specifically twitter cards. related meta tags. I wish my posts looked like the attached example image below with an image, title, description.    I wonder if I’m missing a setting in the Discourse engine where I could set this up, or if there is a plug-in I could add t..." />
<meta property="article:published_time" content="2019-11-22T05:17:14+00:00" />
<meta property="og:ignore_canonical" content="true" />

这些标签在关键位置已经全部存在了。如果你不信,可以亲自查看源代码。

我遇到一位用户,对徽章缺乏更好的分享支持表示不满。徽章看起来就像网站的主页。(目前我不太确定分享徽章是否特别有用,但我认为他们计划创建自定义徽章,并相信这些徽章在社区之外也具有意义)

这是我网站在您提供的 Twitter 链接验证器中的显示效果。所有元标签都已存在,包括 Twitter 卡片。以下是通过该验证器测试的某篇具体帖子的链接:

我不太明白您认为缺少了什么。

谢谢大家!好消息。

我已经重置了 robots.txt 文件,现在 Facebook 可以抓取卡片了!