Bogoを使ってWebサイトを多言語化する方法【ウィジェット・カスタム投稿・自作テーマ対応】

公開日：2025-10-24

WordPress

今回は、WordPressの人気多言語化プラグイン「Bogo」を使って、Webサイトを多言語対応にする方法を解説します。

Bogoを使うと、1つのWordPressのダッシュボード上で各言語ページを管理でき、非常に効率的に多言語サイトを運用できます。

これから多言語対応サイトを構築したい方は、ぜひBogoを活用してみて下さい。

※当サイトはBogoを使って完全英語対応させています。
実際の多言語サイト完成イメージが気になる方は、当サイトを参考にしてみて下さい。

多言語化プラグイン「Bogo」とは？

Bogoは人気お問い合わせフォームプラグイン「Contact Form 7」などの開発も行っている、Rock Lobster Inc社が開発している多言語化プラグインです。

Google Translateなどのブラウザ翻訳による自動多言語化とは異なり、自前で各言語の原稿を用意する必要がありますが、その分、翻訳内容の正確性や表現のニュアンスを自分でコントロールできるほか、言語ごとにSEO対策を行える点も特徴です。

また、単一のWordPressダッシュボード上で各言語ページを管理できるため、言語別に複数のサイトを分けて運用する必要がなく、更新作業やコンテンツ管理を効率的に行えます。

無料で利用でき使い方もシンプルなため、多言語サイトを作りたい場合に非常におすすめのプラグインです。

Bogoのインストール方法

BogoはWordPressの公式プラグインディレクトリからインストールできます。

WordPressのプラグイン新規追加画面で「Bogo」と検索し、出てきたこちらのプラグインをインストール→有効化します。

Bogoが有効化されると、サイドバー上に「言語」という項目が追加されます。

Bogoの使い方

ここでは、対応させたい言語の追加方法から各投稿・固定ページを多言語化する方法、言語切り替えボタンの設置方法まで基本的な使い方を解説します。

Bogoの使い方

対応させたい言語の追加方法
固定ページを翻訳する方法
投稿ページを翻訳する方法
タグ・カテゴリーを翻訳する方法
ウィジェットを多言語化する方法
メニューを多言語化する方法
言語切り替えボタンの作成方法
カスタム投稿ページを多言語化する方法

対応させたい言語の追加方法

まずは、対応させたい言語を追加する必要があります。

対応させたい言語を追加するには、「言語＞言語パック」をクリックします。

追加したい言語パックにカーソルを合わせ、「有効化」をクリックします。

以下では英語を追加します。

これで言語パックを追加できました。

固定ページを翻訳する方法

Bogoでは、1つの投稿につき1つの言語を割り当てることで、多言語化を実現します。

つまり、同じ「アバウト」ページでも、日本語版の「アバウト」と英語版の「ABOUT」のように、言語ごとに個別のページを用意していきます。

すでに、日本語ページが存在する場合は、編集画面を開き、右サイドバー「言語」から「英語の翻訳を作成」をクリックします。

本例では英語の言語パックを有効化しているため、「英語の翻訳を作成」と表示されますが、他の言語パックを有効化している場合は、その言語に応じた表示となります。

「翻訳投稿を作成しました。」と表示されるので、「投稿を編集」をクリックします。

そうすると、英語ページ用に複製された固定ページ編集画面が開くので、あらかじめ用意しておいた英語原稿を使って内容を編集し、英語ページとして仕上げていきます。

これで固定ページの英語翻訳ページを作成できました。

なお、英語サイトは「https://ドメイン名/en/」以下に生成されます。

例

トップページ（日本語）：https://e-valueworks.com
TopPage（英語）：https://e-valueworks.com/en/
アバウトページ（日本語）：https://e-valueworks.com/about/
AboutPage（英語）：https://e-valueworks.com/en/about/

投稿ページを翻訳する方法

投稿ページを多言語化する際も固定ページと同様、すでに作成した投稿の編集画面から「英語の翻訳を作成」をクリックします。

英語の翻訳ページが複製されるので、編集画面を開き、あらかじめ用意しておいた英語原稿を使って内容を編集していきます。

これで、投稿の英語翻訳ページが作成できました。

なお、Bogoではデフォルトで、日本語のお知らせ一覧ページには日本語の投稿一覧が、英語のお知らせ一覧ページには英語に翻訳された投稿一覧が表示されます。

これは、Bogo側が投稿を取得するタイミングで、現在の言語に合わせてクエリ結果を自動的に調整してくれているためです。

通常の自作テーマでも、特別なカスタマイズを行わずにループを回すだけで、現在表示中の言語に対応した投稿一覧が自動的に出力されます。

タグ・カテゴリーを翻訳する方法

投稿を翻訳しても紐づいているカテゴリーは、日本語のまま表示されます。

このカテゴリーやタグ名を翻訳したい場合は、WordPressのダッシュボードで「言語＞テキストの翻訳」をクリックします。

「編集する言語を選択」のところで、言語を選択し「変更を保存」をクリックします。

ここからサイトのタイトルやカテゴリー、タグ等の翻訳ができるのでそれぞれ翻訳し、「変更を保存」をクリックします。

これで、カテゴリー一覧ページのタイトルやカテゴリー一覧ブロックで表示していたカテゴリー部分も翻訳されました。

言語ごとに別でカテゴリー名を用意しても良いですが、その場合、カテゴリーの数が多くなってしまい、カテゴリー一覧ブロックでは、全てのカテゴリーが表示されてしまいます。

そのため、こちらの方法で翻訳する方がおすすめです。

ウィジェットを多言語化する方法

Bogoでは、言語毎に表示するウィジェットを変更できます。

なお、ウィジェットを多言語化するにはWordPress5.8以前のクラシックウィジェットを使う必要があります。

WordPressプラグイン「Classic Widget」を使うことで、クラシックウィジェットに戻すことができます。

Classic Widgets – WordPress プラグイン | WordPress.org 日本語

ウィジェットを追加すると、「次の言語のページで表示」というチェックボックスが表示されます。

ここで、表示させたい言語ページにチェックを入れることで、該当する言語ページのみにウィジェットを表示させることができます。

※特定のプラグインを有効化している状態で、「日本語」または「英語」のいずれかにチェックを入れて保存すると、保存後に両方のチェックボックスからチェックが外れてしまうという現象が発生しました。
同じ現象にお困りの方は、一度すべてのプラグインを無効化した状態で再度お試しください。

メニューを多言語化する方法

メニューの場合もウィジェット同様、メニュー追加時に「次の言語のページで表示」というチェックボックスが表示されます。

そのため、以下のように1つのメニューに日本語と英語のメニューを交互に追加します。

これで日本語と英語で別メニューを表示をさせることができました。

言語切り替えボタンの作成方法

言語切り替えボタンを作成するには、ウィジェットを使用します。

今回は、フッター前のウィジェットエリアに言語切り替えボタンを作成してみます。

表示する場所によってスタイルの調整は必要ですが、以下のように言語切り替えボタンが設置されます。

なお、Bogoの言語切り替えボタンは、ショートコード[bogo]を使うことでも表示させられます。

PHPファイルに直接記述したい場合は、以下のコードで表示させられます。

<?php echo do_shortcode('[bogo]'); ?>

カスタム投稿ページを多言語化する方法

投稿以外にカスタム投稿タイプのページを運用している場合、デフォルトの状態ではBogoはカスタム投稿に対応していません。

Bogoをカスタム投稿ページにも対応させるには、functions.phpに以下のコードを記述します。

<?php
/**
 * カスタム投稿タイプ対応
 */
function my_localizable_post_types($localizable)
{
  $args = array(
    'public' => true,
    '_builtin' => false
  );
  $custom_post_types = array_values(get_post_types($args, 'names', 'and'));
  return array_merge($localizable, $custom_post_types);
}
add_filter('bogo_localizable_post_types', 'my_localizable_post_types', 10, 1);

これで、カスタム投稿ページも固定ページや通常の投稿と同様に、1つの投稿につき1つの言語を割り当てる形で多言語化できます。

また、カスタムタクソノミー（投稿におけるカテゴリーやタグのような分類）の翻訳も、投稿と同様に「言語＞テキストの翻訳」から行うことができます。

カスタム投稿タイプの投稿一覧ページタイトルの翻訳方法

カスタム投稿タイプの場合は、カスタム投稿一覧のタイトル部分だけ日本語のまま表示されます。

これは、どのようなラベル名が設定されるかはテーマ側で事前に把握できないため、翻訳ファイルが用意されていないためです。（設定したカスタム投稿のラベル名がそのままタイトルとして表示される仕様になっています。）

さらに、Bogoではカスタムタクソノミーの翻訳は可能ですが、カスタム投稿タイプのラベル名自体を翻訳することはできません。

そのため、この部分をどうしても翻訳したい場合は、テーマ側で用意されているフィルターフックを利用するか、子テーマを作成して独自に対応する必要があります。

//※以下無料テーマ「Lightning」を使用している場合
//カスタム投稿一覧、カスタムタクソノミー一覧、個別ページのページヘッダー部分のタイトルを変更している例
add_filter( 'lightning_page_header_title_html', function( $html ) {

	$locale = get_locale(); 

	if ( is_post_type_archive( 'blog' ) ) {
		if ( $locale === 'ja' ) {
			return '<h1 class="page-header-title">ブログ</h1>';
		} else {
			return '<h1 class="page-header-title">BLOG</h1>';
		}
	}

	if ( is_singular( 'blog' ) ) {
		if ( $locale === 'ja' ) {
			return '<h1 class="page-header-title">ブログ</h1>';
		} else {
			return '<h1 class="page-header-title">BLOG</h1>';
		}
	}

	if ( is_tax( 'blog_category' ) || is_tax( 'blog_tag' ) ) {

		if ( $locale === 'ja' ) {
			return '<h1 class="page-header-title">ブログ</h1>';
		} else {
			return '<h1 class="page-header-title">BLOG</h1>';
		}
	}

	return $html;
});

ただし、この場合でも、パンくずリスト内の一部にカスタム投稿タイプの日本語ラベルが残ったり、英語ページの<title>タグ部分等が日本語のままになったりすることがあるため、別途調整が必要です。

自作テーマをBogoで多言語化する方法

多くの人気テーマでは、アーカイブページ・404ページ・検索結果ページなどがあらかじめ多言語対応されているため、言語を切り替えると自動的に対応する言語へ翻訳されます。

画像に alt 属性が指定されていません。ファイル名: lightning-404-1024x556.jpg

しかし、自作テーマでは、多くの場合日本語テキストをそのままハードコーディングすることが多いため、多言語対応を行うにはいくつかの対応が必要になります。

事前準備：htmlタグに正しい言語情報が設定されるようにする

まず、Bogoに限らず多言語サイトを作成する際は、表示されているページに合わせてhtmlタグに正しい言語情報が設定されるようにしましょう。

以下のように記述することで、現在表示されているページの言語に応じて、適切な言語属性を<html>タグに出力できます。

<html <?php language_attributes(); ?>>

テンプレートに直接書かれたテキストを翻訳する方法（方法①：ロケール毎に条件分岐する）

テンプレートに直接書かれた日本語テキストを翻訳する方法で最も簡単な方法は、ロケール毎に条件分岐させるという方法です。

基本的に、サイトのロケールは「設定＞一般」の「サイトの言語」で指定した言語が使用されます。

しかし、Bogoを使用している場合は、URLに含まれる言語スラッグ（例：/en/）に応じてロケールが切り替わる仕組みになっています。

現在表示されているページのロケールは、get_locale()で取得できるので、この返り値を利用して条件分岐を行うことで、ページの言語に応じて表示内容を切り替えることが可能です。

<?php
$locale = get_locale();

if ($locale === 'en_US') {
    // 英語ページにだけ表示させたい情報
} else {
    // それ以外で表示させたい情報
}
?>

トップページなどで、翻訳が必要な箇所が多かったり、言語ごとに表示したい画像・コンテンツを切り替えたい場合は、言語ごとにPHPファイルを分け、この方法で制御するのがおすすめです。

<?php $locale = get_locale();
if ($locale == 'en_US') { ?>
  <?php get_template_part('template-parts/front-page', 'en'); ?>
<?php } else { ?>
  <?php get_template_part('template-parts/front-page', 'ja'); ?>
<?php } ?>

しかし、この方法は、アーカイブページや404ページなどのように翻訳箇所が少ない場合には、やや効率が悪いため、そんな場合は次に解説する翻訳ファイルを使用する方法がおすすめです。

テンプレートに直接書かれたテキストを翻訳する方法（方法②：翻訳ファイルpo/moファイルを用意する）

WordPressには、poファイル（およびmoファイル）という翻訳ファイルの仕組みがあります。

これは、WordPressのロケールに対応する翻訳ファイルを準備しておくことで、翻訳対象となった各言語を自動で翻訳してくれるという仕組みです。

この仕組みにより、たとえば管理画面（ダッシュボード）の表示言語も、「設定＞一般」の「サイトの言語」で指定した内容に応じて自動的に切り替わるようになっています。

Bogoを使用している場合は、URLに応じてフロント側のロケールが自動で切り替わるため、あとは翻訳ファイルを用意するだけで多言語化が可能になります。

翻訳ファイルpo/moファイルを使って翻訳する方法

STEP. 1：翻訳対象の文字列を翻訳用の関数で囲う
STEP. 2：テーマ内に翻訳用ファイルの設置場所を作成する
STEP. 3：po/moファイルを作成する
STEP. 4：翻訳ファイルを読み込むための記述を記載する

STEP. 1：翻訳対象の文字列を翻訳用の関数で囲う

まずは、テーマ内の翻訳したい箇所を翻訳用の関数で囲っていきます。

翻訳用の関数にはいくつかありますが、基本的には以下の2つを覚えておけば問題ないかと思います。

__()
_e()

<div class="l-content">
    <div class="p-error">
        <div class="c-container">
            <h1 class="p-error__ttl c-ttl01"><?php _e("お探しのページが見つかりませんでした。", "e-valueworks"); ?></h1>
            <p class="p-error__txt">
                <?php
                printf(
                    __('申し訳ございませんが、<a href="%s">こちらのリンク</a>からトップページにお戻りください。', 'e-valueworks'),
                    esc_url(home_url())
                );
                ?>
            </p>
        </div>
    </div>
</div>

上の2つの関数はどちらも2つのパラメーターを取り、1つ目に翻訳対象の文字列、2つ目に任意のテキストドメイン名（翻訳ファイルを正しく読み込むために必要な名前空間のようなもの）を指定します。

違いとしては、__()は翻訳した文字列を返すのに対し、_e()は翻訳した文字列をそのまま出力します。

// __() は値を返す
$message = __( 'こんにちは', 'e-valueworks' );
echo $message;

// _e() は即出力
_e( 'こんにちは', 'e-valueworks' );

先ほどの例では、404ページのテキストを翻訳用の関数で囲っていきましたが、同じように他のテンプレートファイルでも、テキスト部分を囲っていきましょう。

STEP. 2：テーマ内に翻訳用ファイルの設置場所を作成する

続いて、翻訳用ファイルの設置場所を作成します。

自作テーマの場合は、テーマのアップデートによって上書きされる心配がないため、テーマフォルダ（wp-content/themes/自作テーマ/）直下に「languages」フォルダを作成します。

STEP. 3：po/moファイルを作成する

続いて、STEP. 2で作成したフォルダ内にpo/moファイルを作成していきます。

poファイルは、翻訳元のテキストと翻訳後のテキストをペアで管理するためのファイルです。

上記のpoファイルをもとに機械が理解できるバイナリ形式に変換したファイルのことをmoファイルと言います。

po/moファイルは、Poeditという無料ソフトを利用して作成できます。

POTファイルとは？

po/moファイルと同じようなものとして、POTファイルというものもあります。

こちらは、翻訳元のテキストがリスト形式で並んでおり、これを基にpoファイルが作成される「翻訳元のひな型」となるファイルです。

ただし、Poeditにはソースコード（.php など）から直接翻訳文字列を抽出する機能があるため、POTファイルを経由せずにpo/moファイルを作成できます。

まずはPoeditの公式サイトにアクセスします。

https://poedit.net

「Free Download」をクリックします。

ダウンロードされたファイルを開きます。

セットアップウィンドウが表示されるので、内容を一つずつ確認しながらインストールを進めていきます。

インストールが完了すると、Poeditが開き「Poeditへようこそ」と書かれた画面が表示されます。

Poeditを使ってソースコード（.php など）から直接翻訳文字列を抽出する形で翻訳ファイルを作るには、「ファイル＞新規」をクリックします。

そうすると翻訳言語を指定する画面が表示されますが、今回は日本語をもとに英語の翻訳ファイルを作成したいので、「英語」を選択します。

__( ‘こんにちは’, ‘e-valueworks’ );　・・・　日本語を翻訳元言語に翻訳ファイルを作成していく
__( ‘Hello’, ‘e-valueworks’ );　・・・　英語を翻訳元言語に翻訳ファイルを作成していく

言語の選択ができたら、「ファイル＞名前を付けて保存」をクリックします。

保存先にはSTEP. 2で作成した「languages」フォルダを指定し、保存します。

保存時のファイル名はロケールに正確に基づいた名前である必要があります。
例えば、英語の場合はロケール名が「en_US」なので、en_US.po / en_US.moのように命名しましょう。

これで、フォルダ内にpoファイルとmoファイルが作成されました。

続いて、「ソースから抽出」をクリックします。

「ソースの検索パス」タブを開き、パスのところで「+」アイコンをクリックし、「フォルダーを追加」をクリックします。

検索対象となるファイルは、テーマ直下の全てのPHPファイルのため、「languages」フォルダの1つ上のテーマフォルダを指定します。

検索から除外したいパスがある場合は、「除外するパス」に追加します。

タブを「ソース中のキーワード」に切り替え、「+」アイコンより、追加キーワードとして「__」と「_e」を追加します。

これで、翻訳対象の文字列が抽出されます。

あとは、抽出されたテキストを1つづつ翻訳していきます。

すべて保存できたら、「ファイル＞保存」をクリックします。

Poeditでは、poファイルを保存するとデフォルトで自動的に対応するmoファイルがコンパイルされる設定になっているため、これでpo/moファイルの作成ができました。

STEP. 4：翻訳ファイルを読み込むための記述を記載する

翻訳ファイルを作成しただけでは、テーマ内で__()や_e()といった翻訳用の関数を使っていても、WordPress側ではどの翻訳ファイルを参照すれば良いのか分かりません。

そこで、load_theme_textdomain()関数を使ってどの翻訳ファイルを読み込むのか指定します。

load_theme_textdomain()関数は2つパラメーターを持ち、1つ目に翻訳用の関数でも指定したテキストドメイン、2つ目にmoファイルが格納されているフォルダのパスを指定します。

以下のコードをfunctions.phpに記載します。

function load_text_domain() {
  load_theme_textdomain( 'e-valueworks', get_template_directory() . '/languages' );
}
add_action( 'after_setup_theme', 'load_text_domain' );

これで、言語が切り替わった際に翻訳用の関数で囲ったテキストが翻訳されるようになりました。