サイトへのソーシャルメタタグの追加方法

私はこのサイトを実行しています: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/

しかし、このトピック自体のソースコードを表示してみてください、イワン。何が見えますか?: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 がカードを抽出できるようになります!