Twitter Cardsに対応!

やっとウチのブログもTwitter Cards表示に対応してもらえたので、Twitter Cardsの申し込み方法、審査など。

あれから約2ヶ月半。
やっとウチのブログが Twitter Cards の審査に通った!
申し込んでたのすら忘れてたよ・・・


[追記] 現在は審査などしなくても、単にmetaタグを入れるだけで表示されるようになりました


Twitter Cards」というのは、特サイトのリンクをツイートすると、そのリンク先ページがTwitter内でインライン表示される、というもの。
Amazonなんかもそうだね。

実際の表示はこんな感じ。
Twitter Cards表示例 デスクトップ版

iPhone版も。
Twitter Cards表示例 iPhone版

Twitterでは短縮URLが日常的に使われるから、たまに悪意のあるリンクも出まわってしまう。
こうやってリンクをクリックする前にリンク先の概要が表示されれば、少し信頼性が増すと思う。
Tweitter Cardsは、最初はTwitter側が勝手にやってるものだと思ってたんだけど、実際には申し込みが必要。

まずはHTMLの

~内に専用のメタタグを追加する。
普通のOGPが記述されていればそれを読み込んでくれるような感じだけど、以下の4つのプロパティは最低限あったほうがいい。

<meta name="twitter:card" content="summary">
<meta name="twitter:url" content="http://kijtra.com/">
<meta name="twitter:title" content="きじとらの記事">
<meta name="twitter:description" content="きじとらの記事の概要文ですよ。">

加えて、サムネイル画像もあったほうがクリックされやすくなると思う。

<meta name="twitter:image" content="http://kijtra.com/gazou/no/path.jpg">

次にTwitter Cardsの表示テストページ(要ログイン)で希望のURLを入れてみて、どのように表示されるか確認する。

問題なければ、Twitter Cards申請ページ(英語)で必要項目を入力して送信する。
そんなに重い入力項目じゃないから気軽に申請していいと思う。
申請後は確認メールとか特に来なかった。
申し込みページには「数週間で結果メールを送ります」とあるけど、ウチの場合は約2ヶ月半かかった。
個人サイトじゃ審査通らないだろうなと思って、ダメもとでやったからちょっと嬉しかったw