こんにちは、nozomiです。
ブログの記事をTwitterでシェアしたいな、と思ったことはありませんか?
そのままTwitterにシェアすると、Twitterにはブログ記事のURLがリンクとして表示されますが、URLだとあまり目立たないんですよね~。
なので、こんな風にブログ記事をアイキャッチ画像付きで表示させてあげるんです。

どうでしょうか?
画像があると、通常のリンクよりも見ている人の目を引き付けますよね。
今回は、WordPressのブログ記事をアイキャッチ画像付きでシェアできる方法、【Twitterカード】の設定方法をわかりやすく解説していきます。
設定は、『All in One SEO Pack』のプラグインを使うと簡単にできますよ。
また、Cocoonのテーマを使っている場合は、プラグインを使わなくても設定ができます。
Cocconでの設定方法も併せて解説しますね。
目次
Twitterカードの設定手順
All in One SEOでの設定
今回ご紹介する方法では、「All in One SEO Pack」のプラグインを使います。
まだ「All in One SEO Pack」をインストールしていない方は、先にインストールをしてくださいね。
「All in One SEO Pack」のインストール方法はこちらのページで解説しています。
また、テーマはハミングバードを使用していますので、他のテーマをお使いの場合は、画面の表示が若干異なるかもしれません。
それでは、手順を解説していきます。
① WordPressのダッシュボードにログインしておきます。
左側のメニューの「All in One SEO」にマウスのカーソルを合わせ、表示されたメニューの「機能管理」をクリックします。

②【機能管理】の画面に切り替わったら、【ソーシャルメディア】の「Activate」をクリックします。

③ソーシャルメディアが有効化され、画面左側のメニューに表示されますので、「ソーシャルメディア」をクリックします。

④【ソーシャルメディア】の画面に切り替わりますので、設定をしていきます。

①「AIOSEOのTitleとDescriptionを使用する」の□をクリックしてチェックを入れます。
②サイト名・・・あなたのサイト名を入力します。
③ホーム画像・・・「画像をアップロード」をクリックします。
⑤【Coose Image】の画面が表示されます。

①ブログのイメージ画像をクリックして選択し、②「Coose Image」をクリックします。
URLが表示され、ホーム画像に画像がアップロードされました。

⑥画面を下にスクロールし、次に【画像設定】をします。
「OG:Imageソースを選択」の①「Defalt Image」の「▼」をクリックし、表示された項目の②「アイキャッチ画像」をクリックします。

⑦さらに画面を下にスクロールしていき、【Twitter設定】をします。

①デフォルトTwitterカード・・・「▼」をクリックし「要約」か「要約の大きい画像」のどちらかをクリックして選択します。
「要約」はアイキャッチ画像が小さく表示され、「要約の大きい画像」はアイキャッチ画像が大きく表示されます。
nozomiは「要約」にしました。
②「Twitterサイト」・・・TwitterのIDを入力します。
③「Twitter投稿者を表示」・・・□をクリックしてチェックを入れます。
④「Twitterドメイン」・・・Twitterアカウントのユーザー名から、@以外の部分を入力します。
⑧画面を一番下までスクロールし、「設定を更新」をクリックします。

これで、「All in One SEO」での設定は完了です♪
Cocoonのテーマを使っている場合の設定方法
Cocoonのテーマを使っている場合は、何も設定しなくてもTwitterカードが表示されるようになっています。
ですが、トップページの画像に関しては、設定をしないと下のようなCocoonの画像が表示されてしまうのです。

なので、忘れずに設定をしておきましょう!
①左側のメニューの「Cocoon設定」をクリックします。

②【Cocoon設定】の画面が表示されたら、「OGP」のタブをクリックします。

③【OGP設定】の①「OGPタグの挿入」、②「Twitterカードタグの挿入」にチェックを入れます。
③「Twitterカードタイプ」で「大きな画像のサマリー」を選ぶと、アイキャッチ画像を大きく表示させられます。

④【ホームイメージ】の画像のアップロードの「選択」をクリックし、使いたい画像を選択します。

設定し終わったら、「変更をまとめて保存」をクリックします。
以上で設定は完了です。
Twitterカードバリデータにブログ記事を登録する
続いて、Twitterにブログを登録していきます。
①下のリンクをクリックして、Twitterカードバリデータにアクセスします。
②【Twitterにログイン】の画面が表示されますので、「メールアドレス」と「パスワード」を入力して「ログイン」をクリックします。

③ログインできたら、Twitterにシェアしたいブログ記事の「URL」を入力し、「プレビューカード」をクリックします。

右側の「カードプレビュー」にTwitterカードのプレビューが表示されればOKです。
この場合、まだ画像が表示されていませんね。
画像が表示されるまでは数時間かかることもあるようですが、しばらく待つと表示されるようになります。

このように、画像が表示されていれば、Twitterにシェアしても画像が表示されます。

記事をシェアするには?
Twitterに記事をシェアするのは、ブログ記事の下の方にあるシェアボタンから行います。
①「ツイート」のボタンをクリックします。

②リンクの共有画面が表示されます。

ブログ記事のタイトルと記事のURLが表示されていますので、①ツイートしたい文章も入力し、②「ツイート」をクリックするとツイートされます。
まとめ
Twitterにブログ記事をシェアした時に、アイキャッチ画像が表示されているとやっぱり目立ちますね♪
せっかくシェアするのだから、たくさんの人に記事を読んでもらいたいですよね。
この方法なら「All in One SEO Pack」のプラグインを使って簡単に設定できます。
一度設定をしておけば、次からはすぐに記事をアイキャッチ画像付きでシェアできるので、ぜひこの機能を利用してくださいね~。
最近のコメント