WordPressプラグイン「Yoast SEO」でトップページのTwitterカードを設定する方法

WordPressプラグイン「Yoast SEO」でトップページのTwitterカードを設定する方法

INDEX

  1. Yoast SEOでトップページのTwitterカードを設定する方法
    1. header.phpのheadタグ内にmetaタグを追加
    2. Twitter Card Validatorで結果を確認する
  2. まとめ

ホームページを運営していく上でとても大切なのがSEO対策。

SEOに関する対策を講じる際に一番人気のプラグインがYoast SEOです。

Yoast SEOについての説明は他記事にて紹介されているのでそちらを参考にしてください。

Yoast SEOでは各記事のアイキャッチ画像を自動でTwitterカードにできるのですが、トップページなどのTwitterカードについては設定方法がありません。

サイトリニューアル時などにトップページのリンクをシェアしたいと思うことはかなりあると思います。

今回はそのようなYoast SEOでトップページのTwitterカードを設定する方法をご紹介したいと思います。

Yoast SEOでトップページのTwitterカードを設定する方法

header.phpのheadタグ内にmetaタグを追加

header.phpのheadタグ内に下記コードを追加します。

  <?php if ( is_home()) : ?>
  <meta name = "twitter:card" content="summary_large_image">
  <name = "twitter:image" content="Twitterカードにする画像のパス">
  <?php endif; ?>

各記事のmetaタグはYoast SEOにより自動で設定されるので条件分岐でis_homeの場合のみmetaタグが追加されるようにします。

そして次に

<meta name = "twitter:card" content="summary_large_image">

でサムネイルのサイズを指定します。

summaryもしくはsummary_large_imageを指定できますので、好みに合わせて設定していただければいいかと思います。

次に

<name = "twitter:image" content="Twitterカードにする画像のパス">

の部分ですが、ここで画像のパスを指定します。

パスがしっかりと通っているか確認はしておきましょう。

これだけで設定は完了しました。

では実際に反映されているかみてみましょう。

Twitter Card Validatorで結果を確認する

確認されているかの確認はTwitter Card Validatorで確認できます。

Twitter Card Validatorはこちら

今回はプログラミング講師検定サイトで行ってみようと思います。

設定できましたね!以上で完了です。

まとめ

いかがだったでしょうか?

今回は、Yoast SEOでトップページのTwitterカードを設定する方法を紹介しました。

条件分岐さえ変えればお好みのページにも設定できるので是非ご利用ください。

この記事を書いた人

大西照

大西照

株式会社Esolab 代表取締役

PAGE BACK
お問い合わせ