【解説】WordPressのアイキャッチ画像をOGP設定する【コピペOK】

パソ君

・WordPressのアイキャッチ画像をOGP設定するにはどうする？

こんな疑問にお答えします。

個別ページや固定ページなどのOGPを、アイキャッチ画像に設定したいときありますよね。

実はそれ出力コードにて簡単に設定可能です。

ジト

すぐにできるよ！

ということで、この記事では「WordPressのアイキャッチ画像をOGP設定する方法」について解説していきます！

【解説】WordPressのアイキャッチ画像をOGP設定する【コピペOK】

そんなアイキャッチ画像をOGP設定するコードがこちら↓

<meta property="og:image" content="<?php the_post_thumbnail_url(); ?>" />

このコードをheader.phpのheadタグ内に記述すれば反映できます。

アイキャッチがない場合のOGP画像

ページによってはアイキャッチ画像を設定しなかったり、TOPページ用のOGP画像を設定したいなどありますよね。

そんな時は下記のようなif文を用いて、コードを記述すれば反映可能です。

<?php if (has_post_thumbnail()) : ?>
<meta property="og:image" content="<?php the_post_thumbnail_url(); ?>" />
<?php else: ?>
<meta property="og:image" content="<?php echo esc_url( get_template_directory_uri() . '/img/ogp.jpg'); ?>" />
<?php endif; ?>

コードの意味は
「もしアイキャッチ画像があればアイキャッチ画像をOGPに設定し、
なければ「/img/ogp.jpg」の画像をOGPに設定する」
となります。

こんな感じでif文を用いて追加していけば、色んな仕様でOGP画像を設定できますよ。

ジト

「/img/ogp.jpg」の部分は、その案件ごとに変更してね。

【解説】WordPressのアイキャッチ画像をOGP設定する【コピペOK】：まとめ

ジト

アイキャッチ画像をOGP設定したい時はためしてみてね！

コーディング知識を
『チート級』に得れる教材を作成！

見てみる⋙