Twitterカードは、Twitted時にコンテンツを強調表示するための優れた方法です。 利用可能なフォーマットはいくつかありますが、 Summary / w LargeImageが私のお気に入りです。 これが私のhead.htmlインクルードファイルのJekyllでどのように定義したかです:

<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="@alligatorio">
<meta name="twitter:title" content="{{ page.title }}">

{% if page.description %}
  <meta name="twitter:description"
    content="{{ page.meta_description }}">
{% else %}
  <meta name="twitter:description"
    content="{{ page.content | strip_html | xml_escape
      | truncate: 200 }}">
{% endif %}

いくつかのメモ

ページにメタディスクリプションが定義されていない場合は、Jekyllテンプレートフィルターを使用して投稿の最初の200語をプルします。 PaulStamatiouのトリックに感謝します。 投稿にサムネイルが定義されていない場合は、サイトの一般的なカバー画像を取得します。

明らかに、自分のサイトのTwitterハンドルを反映するようにtwitter:siteを変更する必要があります。 必要に応じて、特定の投稿の作成者のTwitterハンドルにコンテンツを設定してtwitter:creatorを定義することもできます。 おそらくこれについては、投稿の Jekyll FrontMatterで作成者が定義されているかどうかを確認できます。

カードの検証

このツールを使用して、Twitterカードを検証できます。 ラージイメージタイプのサマリーカードには、twitter:card、twitter:site、twitter:title、twitter:descriptionが必要です。