応用編課題の絞り込み検索機能を VK Filter Search を使って実装し、カスタマイズする方法を紹介してきました。その過程で、ブラウザーのタブに表示される「“”の検索結果」という文言が気になりませんでしたか？私はとても気になったので、カスタマイズ方法をご紹介します。コードをご覧ください。
// 表示する文字列
function zero1pg_shop_search_text() {
return 'ショップ検索';
}
// タイトルの書き換え
add_filter( 'document_title_parts', function( $title ) {
if( is_search() ) {
$title['title'] = zero1pg_shop_search_text();
}
return $title;
});
// パンくずリストの書き換え
add_filter( 'vk_breadcrumb_array', function( $breadcrumb_array ) {
if ( is_search() ) {
$breadcrumb_array[1]['name'] = zero1pg_shop_search_text();
}
return $breadcrumb_array;
});文字列を返す関数
タイトルとパンくずリストの両方の文字列を「ショップ検索」に変更したいので、文字列を返す関数 zero1pg_shop_search_text() を定義しました。これは、変更を容易にするためです。この関数を用いて文字列を変更すれば、関数を呼び出す箇所で変更が反映されるメリットがあります。別々の文字列にしたい場合、この関数は必要ありません。
タイトルの書き換え
ブラウザーのタブに表示されるのは、HTML の title タグで囲まれた文字列です。この「タイトル」という単語は、さまざまな意味で使われるので、混同しやすいです。ここで言う「タイトル（document title）」は、HTML文書のタイトルを指しています。
タイトルを書き換えるには、document_title_parts フィルターフックに function( $title ){ } を追加します。この無名関数は、検索ページの場合に $title を「ショップ検索」に書き換えます。渡される引数 $title は連想配列なので、$title['title'] のように要素名を使用して配列にアクセスします。
詳細については、apply_filters( ‘document_title_parts’, array $title ) を参照してください。「うまくいかなかったこと」というブログ記事でも触れているので、そちらも参考にしてください。
パンくずリストの書き換え
検索結果ページのパンくずリストは「ホーム/検索結果」と表示されます。このままでも問題ありませんが、簡単に書き換えられるので、その方法を紹介します。
vk_breadcrumb_array フィルターフックに function( $breadcrumb_array ){ } を追加します。この無名関数は、検索ページの場合に $breadcrumb_array を「ホーム/ショップ検索」に書き換えます。渡される引数 $breadcrumb_array は二次元配列なので、$breadcrumb_array[1]['name'] のように配列要素の配列にアクセスします。
パンくずリストはWebサイトの階層構造を示すものです。左から第一階層、第二階層と順番に表示されます。したがって、$breadcrumb_array[0] は第一階層を、$breadcrumb_array[1] は第二階層を表します。このことから、「ホーム」を「TOP」に変更したい場合は、$breadcrumb_array[0]['name'] = 'TOP'; とすることが想像できるのではないでしょうか。
$breadcrumb_array の構造については、/wp-content/themes/lightning/vendor/vektor-inc/vk-breadcrumb/src/VkBreadcrumb.php を参照してください。
