AI要約
WordPressのお問い合わせフォームを別の言語に翻訳したいですか？
ウェブサイトが、英語を母国語としない様々な地域のユーザーに利用されている場合、翻訳は非常に重要です。
朗報ですが、WordPressでの翻訳は非常に簡単です。単語を翻訳するだけでなく、より広い層のオーディエンスへの扉を開くことにもなるということを忘れないでください。🌐
この記事では、WordPressのお問い合わせフォームを翻訳する方法をご紹介します。
WordPressのお問い合わせフォームを翻訳する方法
このチュートリアルでは、WPForms が既にインストールされていることを前提とします。翻訳は各お問い合わせフォームプラグインで若干異なりますので、以下の手順は他のフォームプラグインでは正確でない場合があります。
この記事の内容
ステップ1：簡単な問い合わせフォームを作成する
サイトにWPFormsがインストールされ有効化されていれば、翻訳するフォームの作成を開始できます。
WordPress管理メニューを開き、WPForms » 新規追加に移動します。
完了したら、フォーム設定画面に移動します。まず、フォームにタイトルを付けます。
その後、テンプレートセクションまでスクロールし、2,100以上のWordPressフォームテンプレートから1つを選択します。このチュートリアルの目的では、シンプルな問い合わせフォームテンプレートを選択します。
テンプレートを使用ボタンを押すとすぐに、フォームテンプレートがフォームビルダー内で読み込まれ始めます。
左側のパネルから右側のパネルにドラッグすることで、お問い合わせフォームに追加フィールドを挿入できます。
現時点までに行ったフォームの変更を保存するために、保存ボタンを押してください。
ステップ2：フォームフィールドを翻訳する
WPFormsでは、お問い合わせフォームのフィールドの翻訳は非常に簡単で、いくつかの方法があります。
自動翻訳
この翻訳方法に従う場合は、まずWPFormsが提供する埋め込みオプションのいずれかを使用してフォームを公開する必要があります。次に、以下の指示に従ってください。
フォームフィールドを任意の言語に翻訳する最も速い方法は、Weglotプラグインを使用することです。
Weglotは有料プラグインで、言語切り替えボタンをクリックするだけで、サイト上のコンテンツを任意の言語に即座に翻訳できます。
WPFormsで構築されたフォームを含む、WordPressサイト上のあらゆる種類のコンテンツに対応しています。WPFormsのインストールと同じ手順でWeglotをインストールできます。
プラグインをインストールしたら、WordPress管理メニューのサイドバーからWeglotをクリックします。
これでWeglotの設定画面が表示されます。
Weglotの翻訳サービスを使用するには、Weglotでアカウントを作成し、APIキーを使用してWordPressとアカウントを接続する必要があります。
APIの下にあるWeglotリンクをクリックして、Weglotアカウントを作成し、APIキーを取得してください。
メールアドレスとパスワードを入力して、新しいアカウントを作成してください。
Weglotから確認メールが送信されます。メール内のリンクをクリックすると、Weglotダッシュボードにリダイレクトされ、APIキーをコピーできます。
次に、WordPressサイトのWeglot設定ページにブラウザタブを戻し、APIキーを貼り付けます。
サイトの元の言語も選択する必要があります。次に、コンテンツやフォームを翻訳したい対象言語（複数可）を選択します。
次に、下部にある変更を保存ボタンを押します。
Weglotは、サイトが多言語化されたことを確認するモーダルを表示します。
次に、連絡フォームを公開したページにアクセスし、下部にある言語切り替えを使用して、フォームを別の言語に翻訳してください。
ご覧のとおり、Weglotはフォームフィールドのラベル、ボタンのテキスト、サブラベルを希望の言語に翻訳します。
ただし、どの翻訳プラグインもWPFormsの検証およびエラーメッセージを自動的に翻訳することはできません。
そのため、ステップ3で示されているように、検証メッセージは手動で翻訳する必要があります。
また、Weglotは10日間の無料トライアルがある有料プラグインであることを念頭に置いてください。10日後も翻訳機能を引き続き使用するには、有料プランを購入する必要があります。
これが最適な選択肢でない場合は、連絡フォームを無料で手動で翻訳する方法を説明します。
手動フォーム翻訳
WPFormsでフォームを手動で翻訳するのは非常に簡単です。フォームフィールドのラベルを変更するには、フォームエディターでフォームフィールドをクリックし、デフォルトのラベルを翻訳したい言語に置き換えるだけです。
翻訳にヘルプが必要な場合は、Google翻訳などのオンライン翻訳ツールを使用して支援を受けることができます。
フォームラベルの翻訳後、名前のサブラベル（「名」や「姓」などのフォームフィールドの下にあるラベル）について何か行う必要があります。WPFormsでは名前のサブラベルを編集できませんが、回避策があります。
変更したいサブラベルのフィールドをクリックして、左側のペインでフィールドオプションにアクセスします。次に、[高度な設定]タブをクリックします。
サブラベルは翻訳できませんが、サブラベルの代わりにカスタムプレースホルダーを使用できます。
プレースホルダーフィールドに翻訳を挿入します。
次に、一番下までスクロールして、[サブラベルを非表示]トグルボタンをクリックします。
送信ボタンのテキストとフォーム名（元のフォーム名に英語を使用した場合は）も翻訳する必要があります。
これを行うには、フォームビルダー内の[設定] > [全般]に移動します。
右側のペインで、[フォーム名]テキストボックスに翻訳を入力するだけです。
一番下までスクロールし、[送信ボタンのテキスト]および[送信ボタンの処理]テキストボックスで同じ手順を繰り返します。
素晴らしい！これで、フォーム内のすべてのラベルとテキストが翻訳されました。保存を押して、次のステップに進んでください。
ステップ3：フォームの検証メッセージを翻訳する
検証メッセージとは、必須のフォームフィールドが空のままにされた場合や、フォームフィールドに誤ったデータが入力された場合に表示されるテキストのことです。
連絡フォームの検証メッセージを翻訳するには、フォームビルダーを終了し、WordPressダッシュボードからWPForms » 設定に移動します。次に、検証タブをクリックします。
そこから、現在の検証メッセージ（デフォルトでは英語）を、連絡フォームを翻訳している言語に変更するだけです。
注意： {suggestion}のような波括弧で囲まれたテキストは翻訳しないでください。このプレースホルダーテキストを変更すると、エラーメッセージに意味不明な文字列が表示される可能性があります。
完了したら、設定を保存を押します。
これで、フォームを確認するために、誤った入力を行ったり、必須フィールドをスキップしたりすると、翻訳された検証メッセージが表示されるようになります。
これで、WordPressの連絡フォームを翻訳する方法がわかりました！
上記の手順はほとんどのサイトで十分ですが、特定の特殊フィールドを翻訳するためにPHPコードを使用する必要がある特別なケースがいくつかあります。
次のセクションでこれらのいくつかを説明しますので、コードを使用したことがなくても、コードスニペットをコピーして貼り付けるだけで済みます。
ボーナス：高度な翻訳オプション
さまざまな特殊シナリオの詳細に入る前に、まず、WordPressサイトにカスタムコードスニペットを可能な限り簡単な方法で挿入する方法を説明します。
これを行うには、WPCodeというプラグインが必要です。このプラグインをサイトにインストールしてください。
プラグインをインストールしたら、WP管理サイドバーのコードスニペットにカーソルを合わせ、スニペットを追加をクリックします。
次に、「カスタムコードを追加（新規スニペット）」の下にあるスニペットを使用ボタンを押します。
これにより、コードエディタウィンドウが開きます。
上部には、後で参照できるようにスニペットに名前を付けることができます。中央にはコードエディタがあり、独自のコードを記述したり、別のソースからコピー＆ペーストしたりできます。
右上では、コードの性質に応じてコードの種類を選択できます。これらのシナリオではPHPコードを使用するため、ドロップダウンからPHPスニペットを選択します。
素晴らしい。次に、フォームの特定のセクションを翻訳するためにPHPコードを使用する必要がある可能性のある一般的なシナリオをいくつか見ていきましょう。
検証メッセージを複数の言語に翻訳する
同じサイトにさまざまな言語のフォームがあるウェブサイトを考えてみましょう。上記で示したように、ラベルを手動またはWeglotプラグインで簡単に変更できますが、検証メッセージはこれらの方法では個々のフォームごとに変更できません。
サイトでユーザーが選択した特定の言語に基づいて検証メッセージを変更するには、PHPコードスニペットを挿入する必要があります。
ユーザーが選択した言語に基づいて、フォームの検証メッセージをスペイン語またはフランス語に翻訳するコードスニペットを作成しました。
WPCodeを使用して新しいスニペットを追加する手順を上記に示しましたので、コードエディタ内に次のスニペットを挿入してください。
コード挿入方法（自動挿入、すべてで実行）を選択します。
次に、一番上までスクロールし、トグルボタンを押してコードスニペットをアクティブに設定します。スニペットを保存ボタンをクリックします。
おめでとうございます！これで、フォームに選択した言語で検証メッセージが表示されるようになります。
他の言語の翻訳を追加したい場合は、その言語のICL言語コードが必要です（スペイン語の場合は「es」、フランス語の場合は「fr」）。次のように始まるコード行を追加するだけです。
case '[ここに言語コードを入力]':
次に、上記のコード例に表示されているのと同じコードブロックを、case行の直後に使用します。
以下のように、等号の右側に角括弧で囲んで、各検証メッセージの翻訳を追加します（特定の検証メッセージタイプは二重スラッシュで示されます）。
//有効な番号
$strings[ 'val_number' ] = '[ここに翻訳を入力]'
そして、各コード行について繰り返します。
このコードはWPMLおよびPolylangプラグインでテスト済みです。他の言語翻訳プラグインとの互換性は保証されません。
メール確認フィールドのサブラベルの翻訳
メール確認フィールドを使用している場合、サブラベルを別の言語に翻訳したい場合があります。
前の例で示したように、WPCodeを使用して挿入するカスタムPHPコードでこれを行うことができます。
必要なコードは次のとおりです。
サブラベルの翻訳テキストは、$properties関数の等号の右側に挿入する必要があります。
たとえば、スペイン語のメール確認フィールドのサブラベルのために、上記のコードを次のように変更する必要があります。
$properties[ 'inputs' ][ 'primary' ][ 'sublabel' ][ 'value' ] = __( 'Introduce tu correo electrónico', 'plugin-domain' );
$properties[ 'inputs' ][ 'secondary' ][ 'sublabel' ][ 'value' ] = __( 'Para confirmar, vuelva a ingresar su dirección de correo electrónico aquí', 'plugin-domain' );
上記のコードは、サイトのフォーム全体でメール確認フィールドの検証メッセージを変更します。ただし、上記のコードをわずかに変更することで、個々のフォームのみに変更することも可能です。
/**
* Customize email field properties.
*
* @link https://wpforms.com/developers/how-to-change-sublabels-for-the-email-field/
*/
function wpf_dev_email_field_properties( $properties, $field, $form_data ) {
// Only process this snippet on the form ID 123
if ( absint( $form_data[ 'id' ] ) !== 123 ) {
return $properties;
}
// Change sublabel values
$properties[ 'inputs' ][ 'primary' ][ 'sublabel' ][ 'value' ] = __( 'Enter Your Email', 'plugin-domain' );
$properties[ 'inputs' ][ 'secondary' ][ 'sublabel' ][ 'value' ] = __( 'To confirm, re-enter your email address here', 'plugin-domain' );
return $properties;
}
add_filter( 'wpforms_field_properties_email' , 'wpf_dev_email_field_properties', 10, 3 );
if ( absint( $form_data[ 'id' ] ) !== 123 ) のコード行で、「123」を関心のあるフォームの実際のフォームIDに置き換えるだけです。
フォームIDは、WPForms » すべてのフォームに移動し、目的のフォームのショートコードでIDを確認することで見つけることができます。
その他の翻訳オプション
特定の種類のフォームにのみ関連付けられた他のフィールドや検証を翻訳したい場合は、次の開発者ドキュメントを確認できます。
次に、アコーディオンフォームを作成します
アコーディオンデザインは、折りたたみ可能なセクションを使用して長いフォームの入力を容易にする素晴らしい方法です。WordPressでアコーディオンフォームを作成するためのすべての手順を、アコーディオンフォームの作成に関する詳細ガイドでご覧ください。
フォームの作成準備はできましたか？最も簡単なWordPressフォームビルダープラグインで今日から始めましょう。WPForms Proには多くの無料テンプレートが含まれており、14日間の返金保証が付いています。
もしこの記事がお役に立ったなら、WordPressの無料チュートリアルやガイドをもっと知るために、FacebookとTwitterでフォローしてください。
「*/</code>」は機能しないため削除してください。
アナさん、こんにちは。お時間のある時に、サポートで直面している問題について詳細をお知らせいただければ、さらにサポートさせていただきます。
WPFormsのライセンスをお持ちの場合は、メールサポートをご利用いただけますので、サポートチケットを送信してください。
それ以外の場合は、WPForms Lite WordPress.orgサポートフォーラムで限定的な無料サポートを提供しています。
ありがとうございます 🙂