【WordPress】Twitterで記事紹介するなら画像を表示させよう(プラグインなし)

【WordPress】Twitterで記事紹介するなら画像を表示させよう(プラグインなし)

みなさんはTwitterを利用されていますか?

利用しています!
ブログで新しい記事を書いたらつぶやいて、多くの人に見てもらえるようにしています。

このような使い方は多いですよね。
ブログを始めてすぐの頃は、なかなかGoogle検索から来てくれる読者さんは少ないもの。

だからTwitterで自分のブログを宣伝して見に来てもらうのは、初心者さんにはおすすめのプロモーション方法だと思います。

でもたまに気になるのが、Twitterでつぶやくときにサムネイル画像が設定されていない人がいることなんですよね。

サムネイル画像とは、こういう画像のことです(赤枠部分)

Twitterに記事のサムネイル画像を表示しているところ

これが設定されていないと…

サムネイル画像設定なしの記事をツイートする画面

こうなってしまいます!

画像があるのとないのとでは、アピール度が全く違いますので、設定されていない方はぜひぜひ設定してみてくださいね。

では早速、画像の設定方法を見ていきましょう♪

特にプラグインやツールなどは必要ありません。※

※SWELLを使用されている方は、ブログ全体のトップページのOGP画像を表示する際「SEO SIMPLE PACK」という無料のプラグインが必要となります。

目次

Twitterで記事を画像付きツイートするには

Twitterで記事をツイートしたときに、画像付きにするためには、記事で「OGP画像」を設定します。

本来はコードを使ってPHPファイルに書き込む必要がある作業(つまりちょっと難しい)ですが、たいていの場合はWordPressのテーマで簡単に設定できるようになっています。

設定方法は、使っているWordPressのテーマによって変わってきます。

私は無料テーマのCocoonと、有料テーマのSWELLを使用していますので、今回はこの2テーマの場合を説明しますね。

CocoonでTwitter用画像を設定する方法

Twitter用の画像を設定したい記事を「投稿一覧」から選んで、編集状態にしましょう。

STEP
画像設定したい記事を選ぶ

Twitter用の画像を設定したい記事を「投稿一覧」から選んで、編集状態にしましょう。

STEP
右側の設定項目の中から「SNS画像」を選びましょう。
右側の設定項目の中から「SNS画像」を選びましょう
STEP
画像を選択保存で完了

そこにTwitterで表示させたい画像を選択して保存すれば完了です。

大体の場合、アイキャッチ画像と同じにする方が多いと思います。

もしも「SNS画像」の項目が表示されていなかったら、ページの右上にある「表示オプション」をクリックしましょう。
ページの右上にある「表示オプション」をクリック

その中にある「SNS画像」のチェックが外れていると思うので、それにチェックを入れれば表示されます。
「SNS画像」のチェックが外れていると思うので、それにチェック

とっても簡単にできちゃう!

SWELLでTwitter用画像を設定する方法

SWELLでは、特に画像を設定しなくてもアイキャッチで指定した画像が使用される仕組みになっています。

もしもTwitterに投稿する際は、アイキャッチと違う画像を使いたい…という場合には「SEO SIMPLE PACK」という無料のプラグインが必要となります。

TwitterでブログトップURLを画像付きツイートするには

もう一つ忘れてはならないのは、Twitterで自分のブログのトップページURLをツイートするとき。

よくTwitterの固定ツイートなどで見かけたことがありませんか。
こういう感じのツイートです。

自分のブログURLを記入すると、勝手に画像が挿入されるって知ってました?
自分のブログURLをツイート

これを設定をしないとこんな風に表示されます。
OGP画像なしで自分のブログURLをツイートするとこうなるよ

これは私の例です。
WordPressのCocoonを使用しているため、もともと設定されているCocoonの画像が表示されてしまっています。

これは何だかちょっと悲しい…。

さっそく画像を設定して、ツイッターでつぶやいたときにアピールできるように直しましょう!

CocoonでブログURLを画像付きでツイートする方法

STEP
Cocoon設定から「OGP」を選択

WordPressダッシュボード-メニュー項目-「Cocoon 設定」をクリック。
Cocoon 設定ページ上部のタブの中から、「OGP」を選択します。

Cocoon 設定ページ上部のタブの中から、「OGP」を選択します
STEP
ホームイメージに画像を設定

ページを下にスクロールします。
ホームイメージ」の項目があり、Cocoon画像が設定されていると思います。

「画像のアップロード」右側にある「選択」ボタンを押して、自分の好きな画像を選択すると以下のようになります。

Cocoonでホームイメージを設定
STEP
保存して完了

選んだ画像が表示されているのを確認して「変更をまとめて保存」をすれば、設定完了です。

Cocoonでトップページを作成している場合

固定ページや投稿ページでトップページを作成している方もいますよね。

その場合は、その固定ページや投稿ページで指定したOGP画像が表示されます。

SWELLでブログURLを画像付きでツイートする方法

SWELLの場合は、「SEO SIMPLE PACK」にて設定する必要があります。

Twitterでの表示を確認する方法

ちゃんと設定されているか不安だな…

そう思う場合は「Card Validator」を使ってみましょう。

Twitterでつぶやく前に、どのようにTwitterで表示されるかを、事前にブラウザ上で確認することができるWebサイトです。

Card Validator」のページにいき、表示させたいブログ記事のURLを入力して「Preview Card」のボタンを押してみてください。
すると、ツイートしたときにどのように見えるかが表示されます。

すぐに反映されなかったり、エラーになることも多いです。
もしも表示されなかったら何度か繰り返し「Preview Card」ボタンをクリックするとちゃんと見られますよ。


Card Validatorを使う様子

TwitterでURLを画像付きツイートする方法/まとめ

以上、TwitterでURL画像付きでツイートする方法でした。

まとめると、

ということになりますね。

まだ設定されていない方は、ぜひ設定してみてください!
ツイートしたときに、見栄えが全く変わりますよ。

以上、ともかでした!

Twitterでもお待ちしていますので、仲良くしてくださいね♪

ブログジャンルの人気ブログランキングをチェック!
ブログ初心者ランキングで第1位は誰か見てみる

\この記事も読んでみてね!/

管理人ともかのプロフィール

プロフィール

管理人のプロフィールです。
今までのブログ履歴や実績などについてまとめました。

ブログ作成のロードマップ

ブログ作成のロードマップ

ブログを作りたい!作り始めたばかり!の方向けのロードマップ。まずは0円→1円を狙う収益化できるブログの作り方を学ぼう。

初心者向けの記事一覧

初心者向け記事一覧

初心者向けの記事の一覧はこちらから。

気に入ったらシェアしてね
  • URL Copied!
目次
閉じる