Lightning サイトでタイトル内のセパレーターをカスタマイズするには

多くの Lighting のサイトで <title> に出力されるコードは以下のように、投稿・固定ページのタイトル と サイトのタイトル がセパレーター | で区切られていると思います。

<title>Lightning サイトでタイトル内のセパレーターをカスタマイズするには | Lightning / VK Blocks / WordPress のカスタマイズ ②</title>

このセパレーターを | から - に変更して以下のような出力になるようにカスタマイズしてみましょう。

<title>Lightning サイトでタイトル内のセパレーターをカスタマイズするには - Lightning / VK Blocks / WordPress のカスタマイズ ②</title>

あれ、ググって見つけた方法だとうまくいかないなぁ

ググってみると、以下のようにフィルターフック document_title_separator を使うカスタマイズ方法を載せているサイトがいくつか見つかります。

function my_document_title_separator( $sep ){
  $sep = ' - ';
  return $sep;
}
add_filter( 'document_title_separator', 'my_document_title_separator' );

実際にこのやり方を Lighting のサイトで試すと、うまくいかないことが多いと思います。

プラグイン VK All in One Expansion Unit の [タイトルタグの書き換え] が有効になっていると、document_title_separator が期待通りに動作しないことが原因です。

上図の [タイトルタグの書き換え] のチェックを外して機能を無効にすると document_title_separator が動作しますが、この機能を有効にしたままセパレーターをカスタマイズしたい方も多いと思います。

そこで、

ベクトルさんがフックを用意してくれています

VK All in One Expansion Unit で用意されているフィルターフック vkExUnit_get_wp_head_title_sep を使って以下のコードを記述すると、[タイトルタグの書き換え] を有効にした状態でセパレーターをカスタマイズすることができます。

function my_vkExUnit_get_wp_head_title_sep( $sep ){
  $sep = ' - ';
  return $sep;
}
add_filter( 'vkExUnit_get_wp_head_title_sep', 'my_vkExUnit_get_wp_head_title_sep' );