はじめに
SNSシェア時に表示されるOGP画像は、ウェブサイトにとって重要な要素です。視覚的に目を引く画像は、クリック率（CTR）を劇的に向上させ、コンテンツの拡散力を高めます。
WordPressサイトでは、投稿や固定ページでアイキャッチ画像を使用し、トップページやアーカイブページに別のデフォルト画像を設定したいことがよくあります。
この記事では、動的にOGP画像を管理する方法を解説し、SEOやSNSシェアに強いサイトを作り上げる方法をお伝えします。
OGP画像とは？なぜ重要？
OGP（Open Graph Protocol）画像は、SNSにおいて記事やページがシェアされる際に表示されるサムネイル画像です。
この画像は、ユーザーの目を引く要素として、クリック率や拡散力に大きな影響を与えます。
OGP画像の主な利点
- 視覚的に目を引く: ユーザーがコンテンツをクリックしたくなる要素を提供。
- SEO効果: 適切なOGP画像設定により、検索エンジンにも好影響を与え、サイトのパフォーマンス向上に貢献。
- SNSでのブランドの統一: どのページも適切な画像を持つことで、ブランドの一貫性が保たれる。
適切なOGP画像の設定は、サイトのクリック率や拡散性を最大化するために非常に重要です。
WordPressでのOGP画像設定の基本
WordPressでは、OGP画像を簡単に設定できますが、動的に設定する方法を取るとさらに効率的です。
基本的な設定方法
- アイキャッチ画像を優先: 投稿や固定ページにアイキャッチ画像を設定し、それをOGP画像として使用。
- アイキャッチがない場合はデフォルト画像を設定: アイキャッチ画像が設定されていない場合には、予め設定したデフォルト画像を使用。
- トップページやアーカイブページ: 共通のデフォルト画像を設定しておくと、ページごとに最適な表示が可能です。
これにより、SNSシェア時に常に一貫した画像が表示され、ブランディングやSEOにもプラスの効果があります。
実装例：動的OGP画像を関数で管理する
動的OGP画像設定を行うには、WordPressのfunctions.phpにコードを追加し、テーマの<head>セクションで呼び出します。以下の例で、サイト全体で動的にOGP画像を管理できます。
3-1. functions.phpに関数を作る
/**
* OGP画像のURLを返す関数
* 投稿・固定ページならアイキャッチ画像を優先、なければデフォルト画像
* トップページやブログ一覧などはそれぞれのデフォルト画像を返す
*
* @return string OGP画像URL
*/
function get_og_image_url() {
if (is_front_page()) {
// トップページのデフォルトOGP画像
return get_template_directory_uri() . '/assets/images/ogp-front.png';
} elseif (is_home()) {
// ブログ一覧ページのデフォルトOGP画像
return get_template_directory_uri() . '/assets/images/ogp-home.png';
} elseif (is_singular() && has_post_thumbnail()) {
// 投稿・固定ページのアイキャッチ画像
$og_image = get_the_post_thumbnail_url(get_queried_object_id(), 'full');
if ($og_image) {
return esc_url($og_image);
}
// 取得できなければフォールバック
return get_template_directory_uri() . '/assets/images/ogp-image.png';
} else {
// その他ページのデフォルトOGP画像
return get_template_directory_uri() . '/assets/images/ogp-image.png';
}
}
3-2. head.phpなどテーマのhead内で呼び出す
<meta property="og:image" content="<?php echo esc_url(get_og_image_url()); ?>">
これにより、各ページに適切なOGP画像が動的に設定され、SNSシェア時に最適な画像が表示されます。
画像の設置場所とファイル命名のポイント
OGP画像を適切に管理するために、画像の設置場所や命名規則を統一しておくことが重要です。
画像の設置場所
- 推奨ディレクトリ:
/wp-content/themes/テーマ名/assets/images/配下にOGP画像を配置します。こうすることで、管理がしやすくなります。
画像のファイル命名規則
- 命名規則: 画像名は、
ogp-front.png、ogp-home.png、ogp-image.pngなど、わかりやすく一貫性のある命名を行います。
画像サイズ
- 推奨サイズ: 1200×630ピクセルのサイズがSNSで最適に表示されるため、これに合わせて作成します。
まとめ
- OGP画像はSNSでのシェアにおいて重要な要素です。適切な画像設定がクリック率やSEOに貢献します。
- WordPressでは、アイキャッチ画像を優先し、無い場合はデフォルト画像を設定することがベストです。
- トップページやブログ一覧には専用のデフォルト画像を用意することで、より一貫性のあるブランディングが実現できます。
- 関数化することで管理が容易になり、保守性も向上します。
おわりに
この記事では、WordPressで動的にOGP画像を管理する方法について説明しました。SNSシェア時に魅力的なOGP画像が表示されることで、クリック率が向上し、SEO効果も得られます。
ぜひ、この記事を参考に、あなたのサイトのOGP画像設定を改善し、SNSでの拡散力を最大化しましょう。
もし、OGP画像設定やその他のWordPressに関するご質問があれば、お気軽にこちらからお問い合わせフォームをご利用ください。
株式会社一針一歩では、WordPressのカスタマイズやバックエンド設計のご相談も受け付けております。お客様のサイトのSEOやSNS拡散力をサポートいたします。
