Summaryカード

Summaryカードは、ブログやニュースの記事から製品やレストランの紹介まで、さまざまなウェブコンテンツに使用できます。このカードは、ユーザーがウェブサイトへのリンクをクリックする前にコンテンツのプレビューを確認できるようにするものです。

以下の国連 (@UN) のツイートは、140文字のテキストの下にSummaryカード (画像とテキスト) が表示されています。

Twitterのシステムではツイートにリンクが含まれるとそれを検知し、リンク先のサイト内を検索して使用されているカードのタイプとコンテンツを把握します。カードシステムの仕組みについてより詳しく知るには、「1スタートガイド1」をお読みください。

サンプルコード

ツイートにSummaryカードを追加するのは、ウェブサイトにメタタグを追加するのだけの簡単な作業です。

<meta name="twitter:card" content="summary" />
<meta name="twitter:site" content="@flickr" />
<meta name="twitter:title" content="Small Island Developing States Photo Submission" />
<meta name="twitter:description" content="View the album on Flickr." />
<meta name="twitter:image" content="https://farm6.staticflickr.com/5510/14338202952_93595258ff_z.jpg" />
<meta name="twitter:url" content="https://www.flickr.com/photos/unicphoto/sets/72157645001703785/" />

自分のウェブサイトのアトリビューションとコンテンツを必ず用意してください。

追加したタグが有効になったら、1Twitter Card Validatorを使用してカードの申請を行います。

アプリのダウンロードとディープリンク設定

コンテンツをより魅力的な方法で表示するだけでなく、Summaryカードはモバイルアプリケーションのダウンロードを促進したり、モバイルアプリケーションに直接リンクさせることもできます。詳細は、「1モバイル開発者向けカード」をご覧ください。

参考情報

Summaryカードにタイトル、説明、画像を含める場合に最低限必要なプロパティの提案を示します。

カードプロパティ必須
twitter:card

“summary” に設定する必要があります。

はい
twitter:title

タイトルは簡潔にしてください。70文字までしか表示されません。

はい
twitter:description

| はい

ページの内容を簡潔に要約した、ツイート内に表示するのに適切な説明を加えます。タイトルに使用したテキストを説明の中で繰り返したり、リンクしたウェブサイトが提供する一般的なサービス内容を説明したりしないようにします。 |

説明テキストは、200文字までしか表示されません。

|

twitter:image

| いいえ

ページの内容を表す独自の画像のURL。ウェブサイトのロゴ、作成者の写真、複数のページに使われている画像など、一般的な画像は使用しないでください。
|
使用できる画像の最小サイズは120×120ピクセルで、ファイルサイズは1MBまでです。ツイートの展開表示と詳細ページでは、画像が縦横比4:3にトリミングされ、120×90ピクセルに縮小されて表示されます。また、埋め込みツイートでは120×120ピクセルにトリミングおよび縮小されます。
|

サポートされているタグの全リストは、「1カードのマークアップタグリファレンス」をご覧ください。