Cocoonのパンくずリストでルートテキストを言語によって切り替える方法

Cocoon

約 7 分で読めます。

最近Polylangで多言語サイトにしました。
 テーマはCocoonを使用
そこで困ったのが↓です🤔

英語サイトなのに
 ホーム
と日本語表記されてしまっています🏠

今回はこれをサイトの言語ごとに切り替えるようにしたので、やり方を紹介します。
つまり、英語ページでは以下のように表示させるようにします。

Cocoonのパンくずリストでのルートテキスト変更方法

これは公式サイトに解説があります。

パンくずリストのルートテキストを変更するカスタマイズサンプル集
パンくずリストの「ホーム」部分のテキストを変更する方法。

簡単に解説すると、
 子テーマで関数追加して文字列を指定しなさい
とのこと。

先ほどの公式ページでは以下のようなコードがサンプルとしてあります。
 ホーム から トップ に文字列を変えている。

//投稿・固定記事パンくずリストルートテキスト
add_filter('breadcrumbs_single_root_text', 'breadcrumbs_root_text_custom');
add_filter('breadcrumbs_page_root_text', 'breadcrumbs_root_text_custom');
function breadcrumbs_root_text_custom(){
    return 'トップ';
}

私もプログラマーなので、

yatch
yatch

プログラマブルに文字列を設定できるのなら、言語ごとにreturnする文字列を変えれば実現できそうだ!

と考えました💡

実際にやってみた

で、実際に書いたコードがこれです✒
子テーマのfunctions.php末尾に追記しています。
以下に子テーマ用の関数を書く 以降が追加した部分です。
 4とか固定値をメインロジックに埋め込むのはどうなの、というツッコミはあえて受けます。

<?php //子テーマ用関数
if ( !defined( 'ABS_PATH' ) ) exit;

//子テーマ用のビジュアルエディタースタイルを適用
add_editor_style();

//以下に子テーマ用の関数を書く

// パンくずリストのルートテキストを言語によって切り替える
// 投稿用
add_filter('breadcrumbs_single_root_text', 'breadcrumbs_root_text_custom');
// 固定ページ用
add_filter('breadcrumbs_page_root_text', 'breadcrumbs_root_text_custom');
function breadcrumbs_root_text_custom() {
    if('/en/' === substr($_SERVER['REQUEST_URI'], 0, 4)) {
        return 'Home';
    } else {
        return 'ホーム';
    }
}

解説

私のサイト https://linuxfun.org/ は、ディレクトリ形式で日英を切り替えています。
また投稿のリンクは https://linuxfun.org/yyyy/mm/dd/%post-name%/ という形式です。

そのため、linuxfun.org の後ろにある文字列が/en/なら英語サイト確定と判断していいわけです。
 日本語サイトなら必ず/2020/12/05/ など数字から始まるため
 固定ページにも/en/で始まるページは作っていない

今後中国語サイト🇨🇳を追加したい、といった場合もこのロジックは有効です。
 アメリカ英語🇺🇸とイギリス英語🇬🇧、といった識別は無理かも。

もっとスマートな方法があるような気もしますが、これはこれでわかりやすいので良しとします。

Cocoon側のメカニズム

当然プログラマブルに文字列を変更できるのであれば出力側にも設計がしてあるはずです。
どんなからくりがあるのでしょうか。

見つけました。
apply_filters関数を噛ませていると、今回のような仕掛けを入れられるみたいです。

grep -r breadcrumbs_page_root_text cocoon-master
cocoon-master/tmp/breadcrumbs-page.php:$root_text = apply_filters('breadcrumbs_page_root_text', $root_text);

apply_filters関数自体はWordpressの組込関数みたいですね。

https://wpdocs.osdn.jp/%E9%96%A2%E6%95%B0%E3%83%AA%E3%83%95%E3%82%A1%E3%83%AC%E3%83%B3%E3%82%B9/apply_filters

ここまでで文字列を動的に変えることのできるロジックが繋がりました。納得。

終わりに

いかがでしたか。

他にも英語サイトなのに日本語の箇所はいくつかあります。
 ・コメント書き込み時のボタン
 ・検索フォームのプレースホルダー
 ・モバイル時のフッターメニュー
できる範囲で、無理のない範囲で、修正していければと思います。

ちなみにPolylang自体はとても良くできたプラグインですので宣伝しておきます📺

Polylang
シンプルかつ効率的な方法で多言語化しましょう。いつものように投稿を書き、カテゴリーを作成し、タグを投稿し続けながら、言語を一度に定義します
この記事を書いた人

組込ソフト歴15年の外資系エンジニア。
前職で組込Linuxを使った商品設計/品質確保の業務に従事。
Raspberry Piが好き。
株式投資で年50万円を稼ぐ。
妻は香港人(国際結婚)。

Please follow me
CocoonWordpress
Please follow me

Comments

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