TwitterにURL貼るだけでサムネイルを表示させる方法をご紹介します!
せっかく書いたブログ記事を、たくさんの人に読んでもらうために、ツイッターの投稿にURLを貼って紹介しますよね。
その時にサムネイル付きのリンクがついたツイッターカードという投稿機能が便利です!
実は、TwitterにURLを貼るだけでサムネイルを簡単に表示させるには、ちょっとした設定をするだけなんです!
TwitterにURL貼るだけでは、サムネイルが表示されない!
そんな場合に、URLだけじゃさみしいから、画像をわざわざ貼っている人も見かけます。
TwitterにURL貼るだけでは、サムネイルが表示されない場合の原因と対策もわかりやすくご紹介しています。
Contents
TwitterにURL貼るだけでサムネイルを表示させる方法は?
ざとぴーさん、ぴよたん、#ぴよっこ交流会 のみなさん、こんばんは!
ざとぴーさん企画開催ありがとうございます&お疲れさまです😊
前回少しでもブログ仲間のお役に立てたというコメント頂いて嬉しかったので、今回はリサーチについての記事で参加です‼宜しくお願いします💓https://t.co/icZx9D60gs— あや🇮🇹共同ブログで166万円姉妹の姉の方 (@IrodoriAyetta) July 7, 2021
ワードプレスである一定の条件がそろっていれば、Twitterの投稿でURLを貼りつけするだけでサムネイルを表示させることができます。
ブログ記事のサムネイル画像を表示させるTwitterの投稿機能を、「ツイッターカード」と言います。
上記の画像の赤枠で囲んだところが「ツイッターカード」です。
ツイッターカードとは、画像付きのリンクのこと、と言ってもOKです!
ツイッターカードの種類も選べる
ツイッターカードは4種類あります。
しかし、自分のブログ記事をTwitterで紹介するために使うツイッターカードは2種類です。
サマリーカードと大型画像付きサマリーカードです。
ツイッターはアメリカ発のサービスということもあり、細かい機能は英語表現も覚えておくと安心ですね!
サマリーカードと大型画像付きサマリーカードの英語表記をご紹介しておきます。
- 大型画像付きサマリーカード=Summary Card with Large Image
- サマリーカード=Summary Card
全4種類のツイッターカードは下記の4つです。
- サマリーカード
- 大型画像付きサマリーカード
- アプリカード
- プレイヤーカード
アプリカードは、アプリのダウンロードページにツイッター投稿から直接飛べるカード。
プレイヤーカードは、Yotubeなどの動画や音声をツイッターの投稿上で再生することができるタイプのツイッターカード。
各ツイッターカードは、適したものを選ぶのが最も重要です!
ブログ記事紹介なら、サマリーカードと大型画像付きサマリーカードの2択ですね!
おすすめのツイッターカードは?
ブログ記事にTwitterからアクセスを入れるために使うなら、おすすめのツイッターカードは大型画像付きサマリーカードです。
サマリーカードの場合は、画像が小さく、全体が見えないこともあり、怪しさがUPします。
もちろん、ちゃんとサマリー書いてあるので、怪しくないんですが、少しでも見えないと、「わざと隠してる?」とつい怪しんでしまう習性があります。
恥ずかしさから控えめに…と思う心理もわかりますが、堂々としていないことも、また怪しさを感じてしまいます。
そのため、サムネイルにしっかり文字入れをして、ハッキリどんな記事なのかを明示した上で、大型画像付きサマリーカードを使うのがおすすめです!
文字ツイートが並ぶ中、大きな画像で目を引くという効果も期待できますね!
その場合、画像選びや加工が印象を左右するので、意識できると◎です!
ツイッターカード用のサムネイル作成のポイント
ツイッターカードを意識して、サムネイルを作る場合のポイントは「見やすさ&わかりやすさ」です。
サムネイル作成の具体的なポイントは1点!
『文字入れ加工をして、パッと見でどんな記事かわかるようにすること』
サマリーカードの場合は特に、中央に寄せて文字が切れないようにするのがおすすめです。
大型画像付きサマリーカードでも、同じですが画像にこだわるより、文字が読みやすい背景画像を選ぶのが個人的にはおすすめです。
TwitterにURL貼るだけでサムネイルが表示されない原因と対策!
TwitterにURLを貼るだけでは、Twitter投稿にサムネイルが表示されない…という場合には、必ず原因があります。
実は、多くの場合、ブログ記事のURLを貼っても、ツイッターカードが表示されないのは、ワードプレス側の問題です。
この記事では、ワードプレスブログの方を前提としています。
ワードプレスブログで、TwitterにURLを貼るだけでは、Twitter投稿にサムネイルが表示されるようにする一番簡単な方法は、プラグインで設定することです。
おすすめプラグインは、All in One SEO Pack です。
プラグインでツイッターカードを使えるようにする方法
All in SEO Packを使ってツイッターカードを使えるようにするには、プラグインの拡張機能を活用します。
- ワードプレスのダッシュボード→All in SEO Packを開きます
- All in SEO Packのメニューから「ソーシャルネットワーク」を開きます
- 「Twitter」タブを開きます
- 「Twitterカード設定」を設定していきます。
「Twitterカード設定」で最低限設定すべきは、次の3つです。
- Twitterカード有効化をスライドしてONに(バーが青くなる)
- カードタイプのデフォルトを選択(おすすめは”大きな画像で要約”)
- デフォルトの投稿画像ソースを選択(おすすめは”アイキャッチ画像”)
プラグインなしでツイッターカードが使えるおすすめ無料&有料テーマ
All in One SEO Packは、一部のテーマとは相性が悪いという難点があります。
なぜなら、All in One SEO Packの機能を、テーマ自体が機能として持ち合わせているため、お互いの機能同士が喧嘩してうまく機能しないからです。
これは実は、ネガティブなことではなく、ポジティブなポイントです!
プラグインなしでツイッターカードを使えるということです。
プラグインなしでツイッターカードを使えるおすすめの無料&有料テーマをご紹介します。
- 無料テーマ:Cocoon(コクーン)
- 有料テーマ:JIN(ジン)
それぞれのテーマでの、ツイッターカードの設定方法を詳しくご紹介します。
無料テーマの設定方法
Cocoonは、使いやすく便利な無料テーマで、私たちも複数あるサイトの1つで活用しています。
Cocoonも設定するだけで、プラグインなしでツイッターカードを使うことができるので、ぜひ活用してくださいね。
Cocoonのツイッターカードの設定は2ステップです。
- Cocoon設定から「OGP」タグを開きます
- 「Twitterカード設定」項目で、下記の設定をしていきます
- Twitterカードの有効設定→Twitterカードの挿入にチェック(✓)を入れます
- Twitterカードタイプ→大きな画像のサマリー(summary large image)を選択
上記の設定だけすれば、Cocoonブログで大型画像付きサマリーカードタイプのツイッターカードが使えます!
画像がCocoonの公式画像が表示される?
ちゃんとツイッターカードを設定したのに、Cocoonの公式画像が表示されます…
そんなお声を頂きました。
その方の設定を見せて頂いたのですが、原因はアイキャッチ画像が設定されてないことでした!
アイキャッチ画像を表示させる設定にしたのに、表示すべきアイキャッチ画像がないと、仕方なくCocoonの公式画像を設定するようになっていました。
実は、アイキャッチ画像がない場合に表示させる画像もオリジナル画像を設定することができます。
Cocoon設定から「OGP」タブを開きます。
「ホームページイメージ」の「画像のアップロード」でワードプレスのライブラリ内の好きな画像を選択することができます。
画像サイズは640×480がおすすめです。
小さな画像のサマリーカードを使う場合は、画像中心を切り取ってもどんな画像かわかるような画像にするのがおすすめです。
有料テーマの設定方法
JINは、私たち姉妹も使っていて、アフィリエイトブログで、おすすめの有料テーマの一つです。
JINでのツイッターカードの設定は2ステップです。
- 外観→テーマ→カスタマイズを開きます
- SNS設定(OGP)を開いて下記を入力して「公開ボタン」を押す
- Twitterのユーザー名を入力
- Twitterカードタイプ→Summary Large Imageを選択
- TwitterのURLを入力
上記の設定ができれば、JINを使ったブログで、大型画像付きサマリーカードタイプのツイッターカードを使うことができます。
Twitter投稿前にサムネイルを表示させることができているか確認しよう!
早速ツイッターで記事URLを貼って投稿する前に、ちゃんと設定できているかどうかを確認する方法があります!
実は、この方法をすると、ツイッターカードの設定の反映を促進&強制することもできるんです!
やり方はとっても簡単です。
TwitterのCard Validatorを開きます。
表示されたURLの枠にツイッターカードを作りたい記事のURLを入力して、「Preview card」という青いボタンを左クリックします。
画面右側にツイッターカードのプレビューが表示されます。
大型画像付きサマリーカードが表示されない?
ツイッターカードを以前に使ったことがある方で、大型画像付きサマリーカードに設定を変更したのに、小さい画像のサマリーカードしか表示されない…
そんなお問い合わせをたまに受けます。
そんな時は、Twitterのキャッシュを削除してみましょう。
Twitterのキャッシュ削除が完了したら、もう一度、Card Validatorを開きます。
※開いたままだった場合はリロード(ページの更新)をしましょう。アドレスバーを左クリックしてEnterボタンを押すだけでもOKです
ここまでできたら、もう一度Card ValidatorにURLを入力して、Preview cardボタンを押すと、設定した大きな画像付きサマリーカードが表示されるはずです。
それでも表示されない場合は、何か設定に間違いがある可能性があるので、設定を見直してみてください。
Twitterのキャッシュを削除する方法
私たちはブログ記事作成やリサーチなどのブラウザはGoogleChromeを推奨しているので、GoogleChromeの場合のキャッシュの削除方法をご紹介します。
Google Chromeを開きます。
- 画面右上のご自身のアイコンの隣に縦に3つ点が並んだアイコンを左クリックします
- 「設定」→「プライバシーとセキュリティ」→「閲覧履歴データの削除」を開きます
- 「キャッシュされた画像とファイル」にチェックを入れます
- 「データを削除」ボタンを左クリックして、完了です
TwitterにURLを貼ってもサムネイルを表示させない方法は?
逆にサムネイルを表示させずにURLだけひょうじさせたい!というご要望も一定数あります。
その場合は、ツイッター投稿の時に、ツイッターカードの左上のバツのマークを左クリックすればOKです!
毎回表示させたくない!そんな方は、この記事で紹介したツイッターカードを表示させるための設定を解除すればOKです!
ただし、All in SEO Packというプラグインでツイッターカードの表示を設定している場合は、プラグインの削除ではなく、設定の変更をするようにしてくださいね。
All in SEO Packには、ツイッターカード以外のブログにとって大事な役割を任せている場合がありますので、ご注意ください!
まとめ
この記事では、TwitterにURL貼るだけでサムネイルを表示させる方法をご紹介しました。
Twitterでブログ記事を紹介する場合、やっぱり大きくアイキャッチ画像を表示させるツイッターカードを使うのがおすすめです。
ある調査によると、ツイッターカードを使うと、ブログ記事へのクリック率は1.6%から3%へアップ!
さらに、ブログ記事開いた人が、しっかり時間をかけて記事を読んでくれる人が増えて、読まずに記事を閉じてしまう人が減ったそうです!
これはぜひ取り入れるべきですよね!
また、TwitterにURL貼るだけではサムネイルが表示されないというお困りの方のために、原因と対策を詳しくご紹介しました。
URLを貼るだけではサムネイルが表示されない場合には必ず原因があります。
原因を突き止めてきちんと対策すれば、ツイッターカードを利用して、より多くの方にあなたの記事を読んでもらえるようになるので、ぜひやってみてくださいね。