【SWELL】Twitterでトップページをリンク時、画像が非表示をOGP設定で解決!

Twitterカード
りんご

Twitterで自分のブログのトップページをリンクさせたら画像が表示されないんだけど・・。

とお悩みの方に、【SWELL】をお使いの方が簡単に画像を表示できる方法をご紹介します。

簡単に設定するには「SEO SIMPLE PACK」プラグインの導入が必要です。

【SWELL】をお使いの方なら入れて損はないプラグインなので、まだの方は導入をおススメします!

のこ

開発者が「SWELL」と同じで安心♪
SWELL公式サイトで推奨しているプラグインです

目次

Twitterカードとは

 Twitterカードとは、Twitterで記事を紹介するときに、アイキャッチ画像・タイトル・説明文などを表示させることができる機能のことです。

こんな感じです。

Twitterカードを設定することで、読者に画像からイメージさせることができるため、興味をもってもらいやすくなります。

Twitterカードで画像を大きく表示するには

ダッシュボード ➡ SEO PACK ➡ OGP設定 ➡ Twitter ➡ カードタイプ ➡ 「summary_large_image

Card validatorで確認した画像です

Twitterカードで画像を小さく表示するには

ダッシュボード ➡ SEO PACK ➡ OGP設定 ➡ Twitter ➡ カードタイプ ➡ 「summary

Card validatorで確認した画像です
のこ

アイキャッチ画像の両端が切れてしまいますね。

Twitterでトップページをリンクしても画像が表示されない状況とは

先日、Twitterでサイトトップページをリンクすると画像が表示されませんでした。

Card validatorで確認した時の画像です

記事紹介をする時はちゃんとアイキャッチが表示されるから、同じように表示したいなと思ったわけです。

画像があると、ブログのイメージも伝わり読者が興味を持ってくれる可能性が増えます。

のこ

画像がないともったいない気がしちゃう。
すぐ調べました♪

Twitterでトップページをリンクした時画像を表示させる方法

表示させたい画像を準備して、SEO SIMPLE PACKプラグインのOGP設定で画像を登録するだけでした。

表示させたい画像を準備しましょう

アイキャッチがきれいに反映されてるから、同じサイズ800×450で画像を作ってみました。

作ったのはもちろん「Canva」です。

設定してみると上下が切れてしまいます。

ということで800×400で画像を作り、カード表示を確認しながら微調整しました。

作った画像のデータ

OGP用画像

表示させるとこんな感じ

\ Canva Proを無料で試すならコチラから /

SEO SIMPLE PACKで設定しましょう

画像ができてしまえば簡単です。

のこ

サクッとやってしまいましょう

STEP
ダッシュボードからSEO PACKのOGP設定を開こう
STEP
基本設定から画像をアップロードして登録しよう
STEP
Card validatorでカードの表示を確認しよう

Card validatorへはこちらからどうぞ↓↓

①ブログのアドレスをいれます

Preview card ボタンを押しましょう

STEP
画像が表示されたらOK
のこ

あれ???設定したのに画像が表示されないんだけど・・・。

おとう

そんなあなたは次の見出しに進んでね

設定したのに、Twitterカードに画像が表示されない場合

のこ

わたしも設定後の確認で画像が表示できませんでした。

でも、キャッシュをクリアすればいいので簡単ですよ。

STEP
ダッシュボードからSWELL設定を開きましょう
STEP
リセットタブを開きましょう

②のキャッシュのクリア(ブログカード)からキャッシュを削除するをクリックしましょう。

STEP
Card validatorでカードの表示を確認しよう
STEP
画像が表示されたらOK
のこ

お疲れさまでした♪

まとめ

Twitterカードで記事更新のお知らせなどちゃんとアイキャッチ画像が表示されるのに、ブログのトップページをリンクすると画像が非表示になってしまう。

わたしが「SWELL」をつかっているので、「SWELL」を使っている人に向けたやり方です。

画像の持つイメージの力は偉大です。

せっかく画像を入れられる場所があるなら画像を表示させて読者を振り向かせましょう。

SEO SIMPLE PACKプラグインを導入してあることが前提で

  1. 画像を準備する
  1. SEO SIMPLE PACKのOGP設定で画像を登録する

やり方は簡単です。

画像を表示させることで皆さんのサイトへ一人でも多くの流入がありますように・・・。

シンプルなのに、高機能 。

\ あなたも今日からSWELLERに /

\ 応援ありがとうございます♪(*^-^*) /

\ わたしのおススメ載せてます♪ /

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

コメント

コメントする

CAPTCHA


目次