JetpackのOGP画像を変更する【WordPress】

bookstitle160803_01

WordPressで手軽にサイト始めるのならJetpackは入れておいていいと思う。
かなり多機能。それぞれの機能が必要だったら、それ専門のプラグインを探したり、自分で書いたりしたりしてもいいが、趣味で始めたサイトとかで時間があんあんまりさけなくて・・・、なんてことなら、入れておくと楽チンだと思います。
何より公式のプラグインだということもあって、プラグインのメンテナンスがずっと続けられている安心感がやっぱり大きい。
SNSへの配信や統計情報がダッシュボードから見られたり便利だ。マークダウン記法でも記事を書けるようになるし。

Jetpackでは「パブリサイズ共有」「共有」の機能をオンにすると、自動でOGPの出力をしてくれる。
ただ、このOGPの出力がちょっと癖があるので嫌がる人も多いみたい。
「Jetpack OGP」で検索すると「JetpackのOGPを無効化する」っていう情報がわんさか出てくる(笑)

自分で使っていて気になったのは、アイキャッチの設定されていない記事のOGP画像変えたいなとか、でした。
具体的には、アイキャッチ設定していなくて記事内に画像があるときはその画像をOGPの画像にしてくれるが、あまりに内容が違うことが多くて困ったので。

そこで、公式サイトを参考にフィルターフックを使ってOGP画像の設定を変更しました。functions.phpに追加。


// JetpackのOGP画像変更 function fb_home_image( $tags ) { if ( is_home() || is_front_page() ) { // Remove the default blank image added by Jetpack unset( $tags['og:image'] ); $fb_home_img = 'ここに画像のURL'; $tags['og:image'] = esc_url( $fb_home_img ); } else if( is_single() && !has_post_thumbnail() && get_field('my_customfield') ){ unset( $tags['og:image'] ); $fb_home_img = get_field('my_customfield'); $tags['og:image'] = esc_url( $fb_home_img ); } return $tags; } add_filter( 'jetpack_open_graph_tags', 'fb_home_image' ); //Jetpackのデフォルトの画像を変更する function custom_jetpack_default_image() { return 'ここにデフォルト画像のURL'; } add_filter( 'jetpack_open_graph_image_default', 'custom_jetpack_default_image' );

上のコードでやっているのは二つ。
ひとつはJetpackのOGP画像にアイキャッチが設定されていない場合にカスタムフィールドに入力された画像パスを設定すること。
もうひとつはJetpackのデフォルトのブランク画像の変更。

ひとつ目の方はJetpack公式を参考に、if文で分岐させた。
今回はカスタムフィールドを使って別に画像パスを入力する欄を作っていたので、そこから画像を設定している。
「じゃあアイキャッチでいいじゃん」というツッコミは勘弁してください。自分でもわかってます(汗)
それと、get_field()使ってますが、カスタムフィールドの設定には大好きプラグインAdvance Custom Fieldを利用している。
自分はちょっと変な条件分岐してますけど、ここの条件分岐でいろいろOGP画像の設定をある程度変えられるんじゃないかと思う。

Jetpackを利用する際は他のプラグインと競合したりしてないか確認してくださいね。
多機能すぎて使いこなせてませんが、それでもやっぱり便利なんですもん。
Jetpackの利用にはwordpress.comのアカウントが必要です。

参考サイト

広告
広告

この投稿へのコメント

コメントはありません。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

この投稿へのトラックバック

トラックバックはありません。

トラックバック URL