先日、PVをツイートするサービスにOGP画像の設定を行いました。
これでFacebookやブログでいい感じに表示されるようになりましたが、Twitterがまだ対応できていません。
そんなわけで、Twitterカードの設定も行ってみました。
設定方法
_Layout.cshtml の編集
_Layout.cshtml に次のように書きました。これはTwitter公式ドキュメントのまるパクリです。
<meta name="twitter:card" content="summary" /> <meta name="twitter:site" content=@("@nakaji") /> <meta name="twitter:title" content="PVをツイートするサービス" /> <meta name="twitter:description" content="Google Analyticsから前日のPVをTwitterに投稿するサービスです" /> <meta name="twitter:image" content="http://tweetpvservice.nkd.jp/Content/img/ogp.jpg">
ここだけの話ですが、Razor構文で@のエスケープに苦労してしまいました。"@@nakaji"でいいと思ったのに…
設定の確認
確認はTwitterが提供している Card validator で行います。URL入力して「Preview card」を押すだけです。
設定できてたら上のような画面になると思います。
ツイートしてみた
— なかじ (@nakaji) 2016年4月8日
できたー。
おしまい。
