ブログ

  1. トップページ
  2. Tips
  3. [Wordpress]YoastSEOで投稿タイプごとにアーカイブとシングルページのOGPイメージを指定する

[WordPress]YoastSEOで投稿タイプごとにアーカイブとシングルページのOGPイメージを指定する

  • 投稿日:2019/03/02
  • 最終更新:2019/03/02

デフォルトOGP画像をいっぱい設定したい

Yoast SEOには投稿タイプごとの設定もありますが、投稿タイプの基本設定みたいな個別の(descriptionみたいに)OGP画像を設定する箇所がないのです。無いよね?多分…

この画面にあればいいんだけどなあ

あと、functions.phpで設定した場合、投稿に設定してあっても上書きされてしまうということが発生しました、、デフォルトで投稿が最優先ならば問題なかったんですが。
なので要件としては下記のような流れでOGP画像を設定したいと思ったのでした(単位小さい順)

  1. 個別の投稿に対してYoastSEOからOGP画像の設定があった場合それを最優先する
  2. ない場合は投稿タイプごとのデフォルトOGP画像を設定する
  3. 各投稿タイプのアーカイブでは投稿タイプごとのOGP画像を設定する

ソーーース

function filter_wpseo_opengraph_image( $img ) {

    global $post; //後ほど投稿に設定されているカスタムフィールドの値を使いたいのでこれは必須

    //アーカイブ用の分岐 タクソノミー設定がある場合タクソノミーアーカイブの分も忘れずに。
    if( is_post_type_archive('hoge') || is_tax( 'hoge_category' ) ){
      return get_template_directory_uri().'画像パス';
      //テンプレ階層内にある場合のパスですので適宜変えてください
    } else if( is_post_type_archive('fuga') || is_tax( array('fuga_cat','fuga_tag') ) ){ //複数の場合は配列で
      return get_template_directory_uri().'画像パス';
    } else if( is_archive() || is_home() ){ //デフォルト投稿タイプ
    //この分岐だとここまでに指定した投稿タイプ以外のアーカイブはすべて含まれるのでちょっと広めかもです。
      return get_template_directory_uri().'画像パス';
    }

    //シングルページ用の分岐 個別のOGP画像があるかがミソ
    $ogpimg = get_post_meta($post->ID,'_yoast_wpseo_opengraph-image', true); //YoastSEOの入力欄で指定したOGP画像を取得
    if( $ogpimg ){ //画像が設定されていれば採用
      return $ogpimg;
    } else { //ない場合
      if( is_singular('hoge') && !has_post_thumbnail() ){
        //デフォルトで、サムネが入ってたらサムネにしてくれるので
        //それすら入ってなかった場合はデフォルトのOGP画像にする。
        return get_template_directory_uri().'画像パス';
      } elseif( is_singular('fuga') && !has_post_thumbnail() ){
        return get_template_directory_uri().'画像パス';
      } elseif( is_singular('post') && !has_post_thumbnail() ){
        //最後にデフォルト投稿タイプ用の設定
        return get_template_directory_uri().'画像パス';
      }
    }

    return $img;
}; 
add_filter( 'wpseo_opengraph_image', 'filter_wpseo_opengraph_image', 10, 1 ); //Facebookのやつ用
add_filter( 'wpseo_twitter_image', 'filter_wpseo_opengraph_image', 10, 1 ); //Twitterのやつ用

色々分岐したしどっか違ってたら直して使ってください、、、趣味用なんである程度しか検証してません。

参考サイト

そもそもの画像変更方法とフィルターフックの名前

WordPress SEO by YoastプラグインでSEO対策しよう〜API編〜

株式会社LIG | 東京都台東区上野発のWeb制作会社、世界へ

ちと古い記事ですがフィルターフックの名前はそのままなので問題なしです。
処理もそのまま使えました。段田さんありがとうございます。(もうLIGさんにいないと思うけど)

functions.php内でカスタムフィールドの値を呼び出す

functions.phpで投稿のデータ使うときは global $post の宣言がいることを認識してなかった。まあそうだわな。助かりました

以上です。