「Twitterカードで画像を大きく表示したい」
「Twitterでブログ更新を紹介しようと思ってツイートしたけど、画像がうまく表示されない、、、」
WordPressで書いたブログをTwitterで紹介する場合、画像を大きく見せるTwitterカードは見やすくて便利ですよね。
画像が大きいことでユーザーの目に留まりやすく、リンクのクリック率も変わってきます。
ただ、Twitterカードの画像を表示するためにはWordpress側での設定も必要になってきます。
難しい事はありませんが、表示がされないこともあるのでこのページでは対処法についても解説していきたいと思います。
この記事で分かること
- Twitterカードの設定方法や表示できているかの確認方法（プラグイン追加でＯＫ）
- うまく表示されない時の対処法（キャッシュクリアすればＯＫ）
※ここではWordpressでブログを書いている方を想定して書いています。
この記事はライター２年目、初めて１人でWordpressを解説して2カ月目のふっくーが書きました！
私もWordpressを開設したてで、PVが全然来ない中、
「SNSで少しでも見てもらわなければ！！」
と思いど初心者ながらTwitterの運用を開始しはじめました(笑)
Twitterカードとは
Twitterカードとは、ブログリンクをTwitterに添付してツイートすると、アイキャッチ画像やタイトルが大きく表示される機能のことです。
ヨガに特化しているオンラインサービス、ヨガログの体験記をまとめています！
500以上のレッスン数と、
1レッスンが長めな点から
経験者やインストラクターさんでも満足できる内容だと思いました。https://t.co/yMH3RvbASl— ホットヨガ部 (@hotyoga_bu) July 23, 2020
このアイキャッチ画像が大きく表示されている部分ですね↑このように表示される機能のことです。
Twitterカードが設定されているのが上の画像で、下が未設定の状態です。どちらの方が見やすいかはすぐに分かりますよね。
Twitterカードで画像が大きく表示されることにより、ユーザーの目に留まりやすくなり、ブログにアクセスが流入する・フォロワー数が増えるなどメリットが沢山あります。
Twitterカードを設定するメリット
- アイキャッチ画像やタイトルを目立つように表示することでクリック率が上がる
- 投稿を見たユーザの目に留まりやすくなる
- フォロワー数が増える
初心者はプラグインでTwitterカードを設定するのがおすすめ
Twitterカードを設定する方法はいくつかありますが、初心者の方やコードがわからない人はプラグインを使ってTwitterカートを作るのかお勧めです。
「All in One SEO」というプラグインを使用することで、簡単にTwitterカードの設定ができます。
今回紹介する「All in One SEO」は、Twitterカードだけでなく、SEOに必要な多くの機能が備わっている無料プラグイン（以前はAll in One SEO Packという名前でしたが、20年度末に変更しました）。
ここからは設定方法を画像つきで解説していきますね！
まずはWordpressのログイン画面左から「プラグイン」→「新規追加」で「All inOne SEO」をインストール・有効化します。
インストールすると左検索画面に「All inOne SEO」の項目が追加されます。
左から「All inOne SEO」を選択し、「ソーシャルネットワーク」をクリックします。
「Twitter」を選択し、Twitterカードが有効化されているかを確認します（現在はプラグインをインストールした時点で有効化になっています）
カードタイプのデフォルトを「大きな画像で要約」を選択し、デフォルトの投稿画像ソースは「アイキャッチ画像」にしてください。
忘れずに「変更を保存」して、これで設定は完了です。
HTMLタグなどについて知識のある人は、以下のサイトに記載されているコードを用いてTwitterカードを設定するのもいいと思います。
※一部の有料テーマでは、機能重複を防ぐため、「All in One SEO」のインストールを推奨していないものもありますので、注意してください（私の場合は無料テーマのcocoonでプラグインに追加しています）
画像が表示されているか確認する方法
ではどのような感じでTwitterが表示されているかの確認方法に映ります。
これはTwitter公式のCard validatorというサイトを使うことで簡単に確認ができます！
Card validator をクリックすると、上のような画像になるので、記事リンクを赤い□の部分に入力し、下の青いボタンをクリックします。
すると、右のようにTwitterに投稿するとどんな風に見えるかが表示されます。
Twitterカードに画像表示されない時の対処法
Twitterカードに画像が表示されないうことが時々あります。その原因としては、主に3つのことが考えられます。
- リンクと一緒に別の画像や動画をアップしている
- キャッシュクリアできていない
- WordPress（ブログ）側の設定が違う
- Twitter側の設定が違う
このそれぞれの対処法について詳しく見ていきますね。
リンクと一緒に別の画像や動画をアップしない
Twitterカードが表示されない場合に多いのが、記事リンクと一緒に別の画像や動画を添付してしまうこと。
Twitterカードは他の画像や動画があるとそちらが優先されてしまうので、表示されなくなってしまいます。
Twitterカードを表示したい場合は画像や動画はなしでツイートしてください。
キャッシュクリアをする
Card validatorで画像を確認した際に表示されない場合は、簡単にいうと「previeｗcard」という青いボタンをもう一度押してみてください。これでうまくいく場合も多いです。
新しいTwitterカードを表示する場合、Twitterに以前の記事が残っている（キャッシュが残っているといいます）とうまく表示されないことがあります。
「previeｗcard」のボタンをクリックすることで、キャッシュクリアができ、画像表示できます。
プラグインの設定ミスがないか確認する
もう一つは、Wordpress上のプラグインAll in One SEOの設定ミスが考えられます。
下の設定をもう一度確認してみてください。
おさらいになりますが、Wordpress画面で「All in One SEO」→「ソーシャルネットワーク」→「Twitter」を選択してください。
- Twitterカードが有効化されているか
- 「カードタイプのデフォルト」→「要約の大きい画像」にしているか
- 「デフォルトの投稿画像ソース」→アイキャッチ画像にしているか
Twitter側の設定を再確認する
Twitter側の設定で問題がある場合もあるので、こちらも確認してください。
Twitterには「ツイートする画像/動画をセンシティブな内容を含むものとして設定する」という設定があり、これをオンにしているとTwitterカードが表示されません。
上の設定がオフになっているかの確認方法を画像で解説していきますね。
Twitter画面の左側にある「設定とプライバシー」を選択します。
設定の中の「プライバシーとセキュリティ」を選択します。
、「ツイート」をタップして、「ツイートする画像/動画をセンシティブな内容を含むものとして設定する」の画面に移動します。
「ツイートする画像/動画をセンシティブな内容を含むものとして設定する」がoffになっているのを確認してください。
まとめ
以上、ブログ初心者やTwitterカードを簡単に作りたい！という方向けのTwitterカードの設定・確認方法と表示されない対処法でした。
- 初心者にはプラグインでのTwitterカードの設定方法が簡単
- Twitterカードが表示されているかは、Card validatorという確認ツールで確認できる。
- 画面が表示されない場合、Wordpress側の原因とツイッター側の原因があるので、それぞれの対処法を試してみる
ブログ上級者になってくればHTMLタグでの設定もできるかもしれませんが、Wordpress初心者の方にはプラグインでの設定がおすすめです♪
コメント