こんにちは！ブログ初心者のChiyo（ChiyoM_London)です。
ブログを始めたばかりの時は検索から記事に辿りついてもらえることは少ないのでSNSを通してブログの存在を知ってもらえるのはとっても大事ですよね。
[Blog 更新] ユーザーに圧倒的に愛されているモバイルバンキングアプリのMonzoカードについて書きました。ついに銀行口座機能もついてますます人気になりそうな予感。https://t.co/c7M5HVE0Ly
— Chiyo.M (@ChiyoM_London) November 23, 2017
ツイッターにブログの写真と説明を表示するにはツイッターカードの設定が必要です。
この記事ではYoast SEOというワードプレスのプラグインを使って4つのステップで簡単にツイッターカードを表示する方法を紹介します。
Yoast SEOを選んだ理由
最初は有名なプラグインALL IN ONE SEOで設定を試みたのですがCard validatorで何度確認してもエラーがでてしまったので、Yoast SEOで設定することにしました。
Yoast SEOを使ってツイッターカードを設定する手順
1.ワードプレスの編集画面からYoast SEOのプラグインをダウンロードする。
２.インストールしたらプラグインを有効化（Active)します。
有効化すると左にSEOマークが出るのでそれをクリックしてSocialの画面を開きます。
３.アカウント（Accounts)のタブでツイッターのUsernameをいれます。
4．次にツイッターのタブに移って、下記の設定をします。
カードは現在2種類から選べるのですが、私は説明よりも写真が大きく見えるようにSummary with large imageを選んでいます。
Summary with Large imageを選ぶときの注意点
写真を大きく見せる目的でこのカードを選ぶ人も多いと思うのですがひとつ注意点。
特に設定をしていなければアイキャッチ画像（Featured Image)の写真がそのまま表示されてしまい、その写真がTwitterの規定サイズと合っていないと写真全体が表示されません。
文字を画像に入れている場合は切れてしまうこともあり、全く写真が映えず残念です。
そこでYoast SEOを使ってひと工夫。
追加で用意するものは1024 x 512 pixelsサイズの画像だけ。
この写真をアイキャッチ画像の代わりにツイッターカードに表示します。
記事の編集画面から下にスクロールするとYoast SEOの設定画面がでてくるのでそこでソーシャルを選んで、Twitterタブから1024 x 512 pixelsの画像をアップロードします。
はい、これだけ！簡単ですね。
完了したら念のためCard validatorでツイッターカードがちゃんと設定されたか確認しましょう。
問題なく表示されれば設定完了です。
次からはツイッターでつぶやく時にブログページのURLをいれれば自動的にツイッターカードが表示されるようになりますよ。
ツイッターカードを設定しているのとしていないのでは、タイムライン上での見え方が断然違います。
ぜひ、この記事を参考にしてツイッターカードを設定してみてくださいね。
