はてなブログで「Twitterカード」を小さいアイキャッチ画像「Summary Card」に変更する方法

「Twitterカード」をいじってみた itolicoです。

梅雨のお天気で髪だけでなく、脳内も爆発気味なあたくしですが、今回は「Twitterカード」について書いてみたいと思います。

「Twitterカード」とは、タイムラインでよくお見かけする↓こういった「アイキャッチ画像付きのリンク」のことなんですね。おすすめのWebページだったり、ブログを更新したときにTwitter上でシェアできるので便利ですよね。

7/3 追記：「Twitterカード」のサイズ変更後、新記事をエントリーしたら、埋め込んだツイートも小さいアイキャッチ画像のリンクになりました。一応↓見本のスクリーンショットをUPしておきます。

ただ、ちょっと思ったのが、「Twitterカード」のアイキャッチ画像のサイズを小さくすることはできないものだろうか...ということなんです。

はてなブログの場合、標準でもれなく大きいアイキャッチ画像（Summary Card with Large Image）がついてくるので、オンオフの設定するところがナッシンぐー。では、どうやって変更するかというと...

まずは、どんな風にTwitter上で表示されるのか Card validator で確認してみます。

すでに設定済みなので、小さいアイキャッチ画像（summary）が表示されるようになっています。

次は、はてなブログの方で設定をします。

・ダッシュボードの「設定」から「詳細設定」をクリック
・「headに要素を追加」に以下のコードをコピペする

<meta name="twitter:card" content="summary"></meta>

・「変更する」をクリック

簡単ですね。この設定だと、はてな独自の「アイキャッチのない記事の画像」が表示されるの？？と思いましたが、新規でエントリーした場合、その記事のアイキャッチ画像縮小版がばっちり表示されていました。

今後どんなふうに変わっていくのかわかりませんが、しばらくこの設定でやってみようと思います。

※トライしてみたいと思われる方は、ご自身の判断のもとお試しください。