WPML
チュートリアル

Diviテーマを使用した多言語サイトの構築

Amir1分

共有：

WPMLでDiviテーマを翻訳

概要


Diviはスマートで柔軟な多目的テーマです。使いやすいページビルダーと多数の事前作成済みレイアウトが付属しており、ニーズに合ったウェブサイトの作成に役立ちます。多言語サイトの構築を希望する場合、DiviとWPMLを統合することで、すべてのテーマ要素を簡単に翻訳できます。

必要なもの

  • Diviテーマ（バージョン2.7.3以降）。
  • 最新バージョンのWPML（バージョン3.3.7以降）。これには文字列翻訳、翻訳管理、メディア翻訳アドオンが含まれます。

必須リソース

目次

はじめに

  • Diviテーマをインストールして有効化します。
  • 最初にコアとなるWPMLプラグイン（WPML Multilingual CMS、WPML 文字列翻訳、WPML 翻訳管理）をインストールして有効化し、続いてそれらに依存する可能性のある他のWPMLプラグインをインストールします。
  • WPML > 言語からWPMLをセットアップします。完全なリファレンスについては、WPMLのスタートガイドをご覧ください。最初のシンプルな3ステップのセットアップは直感的で、デフォルト言語、有効にする言語のセット、および言語スイッチャーを選択するよう求められます。（最初はフッター言語スイッチャーを選択してください。これは後で変更できます。）
  • このチュートリアルでは、Diviに付属する事前定義されたレイアウトを使用してホームページを作成します。
  1. WordPressダッシュボードで「固定ページ」、次に「新規追加」をクリックします。
  2. 「Use The Divi Builder」ボタンをクリックします。
  3. 「Load From Library」をクリックします。
ライブラリから読み込む
  1. 下にスクロールし、「Homepage Corporate」の横にある「Load」ボタンをクリックします。お好みのレイアウトを選択できます。
事前定義されたレイアウトの選択
  1. プレビューリンクをクリックしてホームページを確認します。

Diviホームページの翻訳


  1. WordPressダッシュボードで「固定ページ」>「すべての固定ページ」に移動します。各有効言語の列が表示され、各ページの横にペンアイコンアイコン（「翻訳を編集」）またはプラスアイコンアイコン（「翻訳を追加」）が表示されます。プラスアイコンアイコンをクリックして、作成したホームページの翻訳を編集します。
ホームページの翻訳-1
  1. 右側の言語メタボックスにある「英語からコンテンツをコピーする」をクリックし、「Use the Divi Builder」ボタンをクリックします。
ホームページの翻訳-2
  1. ページタイトルとさまざまなテーマ要素に翻訳されたテキストを追加し、「保存」ボタンをクリックします。
ホームページの翻訳-3

これらの手順は、「Divi Page Builder」を使用して作成されたすべてのページに適用されます。

固定ページ、投稿、投稿カテゴリー、カスタム投稿タイプ、カスタムタクソノミーの翻訳


同様に、カスタム投稿タイプである「Projects」を含め、他のすべての固定ページと投稿を翻訳できます。例えば、投稿を翻訳する方法は以下の通りです。
  1. 「投稿」に移動し、プラスアイコンアイコンをクリックします。
  2. 「コンテンツをコピーする」ボタンをクリックして、デフォルト言語の投稿コンテンツを読み込みます。
  3. 翻訳されたコンテンツを追加します。
投稿の翻訳

投稿カテゴリーの翻訳

  1. 投稿 > カテゴリーに移動します。例として、「En-Category」という名前のカテゴリーを作成し、「新規カテゴリーを追加」ボタンをクリックします。
  2. 作成したカテゴリーをクリックします。
カテゴリーの翻訳
  1. 「追加」リンクをクリックしてカテゴリーの翻訳を追加します。
カテゴリーへの翻訳の追加
  1. 名前、スラッグ、および説明フィールドにカテゴリーの翻訳を入力し、「新規カテゴリーを追加」ボタンをクリックします。
カテゴリーへの翻訳済みコンテンツの追加

カスタム投稿タイプ（Project）とProjectカテゴリーの翻訳


カスタム投稿タイプ「Project」は、通常の投稿を翻訳するのと同じ手順で翻訳できます。また、Projectカテゴリーも通常の投稿カテゴリーを翻訳したのと同じ方法で翻訳できます。

カスタムタクソノミーの翻訳

  1. WPML > タクソノミー翻訳に移動します。
  2. 「翻訳するタクソノミーを選択」ドロップダウンメニューから「Project Categories」を選択します。
  3. 以下に示すように、「翻訳」ボタンをクリックして必須フィールドに入力し、カスタムタクソノミーの翻訳を追加してから「OK」ボタンをクリックします。
タクソノミー翻訳

Diviのテーマテキストおよびウェブサイト上のその他の文字列の翻訳


テーマの文字列を翻訳するには、文字列をスキャンする必要があります。これにより、文字列翻訳画面で翻訳用の文字列が登録されます。（詳しくはテーマとプラグインのローカライズをご覧ください。）

これは以下の手順で行うことができます。

  1. WPML > テーマとプラグインのローカライズに移動します。
  2. 「WPMLの文字列翻訳を使用してテーマとプラグインを翻訳」オプションを選択し、「保存」ボタンをクリックします。
WPMLの文字列翻訳を使用したテーマとプラグインの翻訳
  1. 「テーマをスキャンして文字列を探す」ボタンをクリックします。これにより、文字列翻訳画面で翻訳用のテーマテキストが登録されます。以下の図を確認してください。
テーマの文字列をスキャン
  1. これでWPML >> 文字列翻訳に移動できます。

文字列は以下によってフィルタリングできます。
  • 表示する文字列を選択します（翻訳完了、翻訳が必要、翻訳者を待機中）。
  • 特定のテキストドメインを選択します。
  • 「検索:」フィールドに入力して特定の文字列を検索し、「検索」ボタンをクリックします。
  1. 「翻訳」をクリックして翻訳されたテキストを追加します。次に「翻訳が完了しました」オプションを選択し、「保存」をクリックします。
文字列翻訳

テーマオプションの翻訳は、文字列翻訳画面で「admin_texts_et_divi」文字列ドメインを選択することで実行できます。

Diviのテーマオプションの翻訳


テーマオプションは文字列翻訳ページを使用して翻訳できます。例えば、DiviのSEOテーマオプションで利用可能な「Homepage custom title」を翻訳したい場合を考えます。

テーマオプションの翻訳 1

「文字列翻訳」ページに移動し、文字列ドメイン「admin_texts_theme_Divi」を選択します。Homepage custom titleを見つけて翻訳されたコンテンツを追加し、以下に示すように「保存」ボタンをクリックします。

テーマオプションの翻訳 2

Diviのカスタムレイアウトの翻訳


Diviを使用すると、独自のレイアウトを作成し、保存してさまざまな固定ページや投稿で使用できます。カスタムレイアウトの保存と読み込みに関するDiviのドキュメントを確認してください。これらのレイアウトはWPMLを使用して翻訳でき、言語ごとに異なるレイアウトを用意することも可能です。カスタムレイアウトを作成、保存、翻訳、読み込むには、以下の手順に従います。
  1. WordPressダッシュボードでDivi > Divi Libraryに移動し、新規追加ボタンをクリックします。WordPressダッシュボードで切り替えられたメイン言語がデフォルト言語に設定されていることを確認してください。
  2. レイアウト名を入力し、「Template Type:」で「Layout」を選択します。
英語のレイアウト
  1. お好みのレイアウト構造を作成します。この例では左側にテキストモジュール、右側に画像モジュールを追加し、「公開」ボタンをクリックします。
英語のレイアウトの作成
  1. 右側の言語メタボックスにあるプラスアイコンアイコンをクリックして、翻訳されたレイアウトを作成します。
レイアウトへの翻訳の追加
  1. 翻訳されたレイアウトのタイトルを追加します。この例では「Spanish Layout」とします。異なるレイアウト構造を選択することも可能です。例えば、テキストモジュールを右側に、画像モジュールを左側に設定します。お好みのレイアウトを選択し、「公開」ボタンをクリックします。
スペイン語のレイアウト

これらのレイアウトテンプレートをページに読み込む際、英語のページには英語のレイアウトを、スペイン語のページにはスペイン語のレイアウトを読み込むことができます。これは以下の手順で行います。

  1. 新規ページを追加 > 「Use Divi Builder」ボタンをクリック > 「Load From Library」タブをクリックします。
  2. 「Add From Library」タブをクリックし、「Load」ボタンをクリックして英語のレイアウトを読み込みます。
英語のレイアウトテンプレートの読み込み

同じ手順に従って、セカンダリ言語のページに翻訳されたレイアウトを追加できます。

Diviのメニューの翻訳


WPMLを使用すると、言語のメニュー間で簡単に同期できます。詳細については、メニューの翻訳の完全なチュートリアルを確認してください。

ヘルプを見る


DiviテーマでのWPMLの使用についてヘルプが必要な場合は、テクニカルフォーラムにアクセスしてください。

問題を投稿する前に、以下の点を確認することをお勧めします。

  1. テーマとWPMLプラグインの最新バージョンを使用しており、それらがすべて有効化されていることを確認してください。これには、WPML Multilingual CMS、WPML 文字列翻訳、およびWPML 翻訳管理が含まれます。
  2. WPMLプラグインを無効化した場合には問題が発生せず、コアとなるWPMLプラグインのみを有効化した場合に問題が発生することを確認してください。つまり、DiviとWPMLの互換性の問題であることを確認します。そうでない場合は、Diviのサポートの方が適切な支援を提供できる可能性があります。

まとめ


Diviテーマには多くの機能があり、WPMLと統合することで、すべてのさまざまな要素を簡単に翻訳できるようになります。このチュートリアルで紹介した詳細な手順に従うことで、DiviテーマとWPMLを使用してローカライズされたウェブサイトをスマートに構築できます。

この記事が役に立ちましたか？この記事を共有：

おすすめの記事