小金井にあるWEB制作会社の備忘録

MEMORANDUM

プラグイン「Jetpack」で自動挿入されるタグをカスタマイズ

ワードプレス用プラグイン「Jetpack」を使用することでメタタグを自動挿入することが可能になりますが、一部のページでタイトルやディスクリプションを自由に変更したいとの要望があったので対応方法をメモ。

function.php(PHP)

function change_jetpack_tags($tags) {
	if(is_page()){
		if(!empty(get_field('page_title'))){
			//オリジナルタイトル
			$tags['og:title'] = get_field('page_title');
		}
		if(!empty(get_field('page_description'))){
			//オリジナルディスクリプション
			$tags['og:description'] = get_field('page_description');
		}
	}
	return $tags;
}
add_filter('jetpack_open_graph_tags', 'change_jetpack_tags');

上記のコードを、使用しているテーマの「function.php」に追記。
「add_filter」を使用して「Jetpack」内で使われている「jetpack_open_graph_tags」という関数にフックすることで、呼び出し時に追加で作成した関数が機能するように設定。

参考例は個別ページのみということで「is_page()」の場合にのみ適応しているほか、プラグイン「Advanced Custom Fields」に入力した値を参照しているためコードが長くなっています。
基本は「$tags[‘og:title’]」、「$tags[‘og:description’]」に直接の値を挿入することで実装が可能。

また、タイトルやディスクリプションに限らずHTMLに出力される変数は全て「jetpack_open_graph_tags」を通るので、こちらに紐づけることで全ての値の編集が可能。
値は「$tags」に配列として挿入されているので、print_r($tags)等で書き出すことで確認ができます。

同一カテゴリーの記事