パソ君
・WordPressのアイキャッチ画像をOGP設定するにはどうする？
こんな疑問にお答えします。
個別ページや固定ページなどのOGPを、アイキャッチ画像に設定したいときありますよね。
実はそれ出力コードにて簡単に設定可能です。
ジト
すぐにできるよ！
ということで、この記事では「WordPressのアイキャッチ画像をOGP設定する方法」について解説していきます！
この記事でわかること
WordPressのアイキャッチ画像をOGP設定する方法
【解説】WordPressのアイキャッチ画像をOGP設定する【コピペOK】
そんなアイキャッチ画像をOGP設定するコードがこちら↓
<meta property="og:image" content="<?php the_post_thumbnail_url(); ?>" />このコードをheader.phpのheadタグ内に記述すれば反映できます。
ページによってはアイキャッチ画像を設定しなかったり、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】：まとめ
- 「the_post_thumbnail_url」を使えばアイキャッチ画像をOGP設定可能
- if文を用いればアイキャッチ画像がない場合のOGP設定も可能
ジト
アイキャッチ画像をOGP設定したい時はためしてみてね！
