「はてなCMS」では、TwitterでWebページを見やすく表示する「Twitterカード」に対応しています。記事の概要や画像などが1枚のカードのようにまとまった形式で表示されます。
「はてなCMS」をシェアしたときのTwitterカード
記事ページ(1つの記事だけが表示される記事個別ページ)に、アイキャッチ画像になるような大きな画像が設定されているときには、大きな画像付きの「Summaryカード」が表示されます。
画像が設定されていない場合は、「Summaryカード」として記事のタイトル、説明、サムネイルがコンパクトにまとまって表示されます。
「Twitterカード」を指定するメタデータ
「Twitterカード」は、HTMLのヘッダー部でTwitterカードタグ(twitterではじまるmeta要素)を使って内容を指定できます。
例えば、カードの種類はtwitter:cardというメタデータで指定し、次の値が指定されていると大きな画像付きのSummaryカードになります。
<meta name="twitter:card" content="summary_large_image" />
「はてなCMS」ではこの値を自動で設定しますが、「Twitterカード」の内容をいくつかの「編集オプション」でカスタマイズすることができます。詳細は、「編集オプションの設定とOGP」を参照してください。
独自ドメインでのTwitterカード
独自ドメインを使用している場合に、Twitter開発者のWebページから使用ドメインごとに「Twitterカード」の申請をしなければならないことがあります。Twitterカードが表示されないなどの問題がある場合には、次のTwitterのドキュメントを参照してください。
Twitter Cards | Twitter Developers
カードタイプを選択する際、「はてなCMS」では上記のように2種類のカードを利用しているため、各ドメインに対してSummary Card(Summaryカード)とSummary Card with Large Image(大きな画像付きのSummaryカード)の申請作業が必要です。