Cocoonでタイトルのセパレーターが変更できない原因と正しい解決方法

Cocoonカスタマイズ集
この記事は約3分で読めます。
記事内に広告が含まれています。

はじめに

Cocoon設定→タイトル→「タイトル共通設定」からセパレーターを変更できます。
しかし、選択肢として用意されているのは基本的に「|(半角パイプ)」か「-(半角ハイフン)」のみです。

以下の記事では、これを変更する方法を紹介しています。

しかし、掲載されているコードにはいくつかの問題があるため、今回は修正を加えたコードを作成します。

そこで、既存コードの懸念点を踏まえたうえで、「なぜ正しく動作しなかったのか」という根本原因と、安全で正しい実装方法を解説します。

問題点

原因

記事タイトルへの影響

以下のように document_titleフックして、タイトル全体の文字列を無理やり置き換えています。

add_filter('document_title', function ($title) {
  $title = str_replace(' | ', '|', $title);

  return $title;
});

この方法では、もし記事タイトル自体に「|(半角パイプ)」が含まれていた場合、セパレーターだけでなく意図しない箇所の文字まで強制的に全角へ変換されてしまいます。

原因の誤解

WordPress標準のコードが効かなかった原因は、文字コードでもCocoonのバグでもなく、フックの実行優先度にあります。

通常、WordPressでセパレーターを変更する際は以下のコードを書きます。

add_filter('document_title_separator', function ($sep) {
  return '|';
});

しかし、Cocoonの親テーマ内部では、すでにこのフックを使ってセパレーターを出力する処理が登録されています。

WordPressでは、優先度(add_filterの第3引数)を省略するとデフォルトの10が割り当てられます。

子テーマのfunctions.phpは親テーマよりも先に読み込まれるため、「子テーマで「|(全角パイプ)」 に変更した直後に、親テーマが「|(半角パイプ)」で上書きしてしまう という現象が起きていたのです。

対策

解決策は非常にシンプルです。
子テーマ側のadd_filterの第3引数に20などの大きな数字を設定するだけです。
親テーマの処理が終わった「後」に実行させることで、安全かつ確実にセパレーターを上書きできます。

実装手順

以下のコードをfunctions.phpに追加します。

add_filter('document_title_separator', function ($sep) {
  return '|';
}, 20);

さいごに

今回紹介した方法を使えば、Cocoonのタイトルセパレーターを記事タイトルに影響を与えることなく、安全かつ確実に「|(全角パイプ)」へ変更できます。

str_replaceを使った無理やりの置き換えは、一見うまく動いているように見えても、記事タイトル内の半角パイプまで意図せず全角化してしまうリスクを抱えています。
WordPressのカスタマイズでコードが効かない場合は、処理の不具合を疑う前に「フィルターフックの優先度」を見直すことが重要です。

タイトルとURLをコピーしました