<html lang="ja-jp" dir="ltr"><head></head><body>### [ローカライズの日付ピッカー文字列](https://wpforms.com/developers/localize-the-date-picker-strings/)

**公開日:** 2021年3月22日
**著者:** David Ozokoye

**抜粋:** このスニペットは、WPFormsの日付ピッカーフォームフィールドを使用する際の日付ピッカーのローカライズ方法を説明します。

**コンテンツ:**

WPFormsの日付/時刻フィールド内の日付ピッカー文字列をローカライズしたいですか？デフォルトの日付ピッカーの言語は英語です。しかし、サードパーティのJavaScriptライブラリを使用すると、日付ピッカー文字列を他のサポートされている言語に翻訳できます。

このチュートリアルでは、JavaScriptを使用して日付ピッカー文字列をローカライズするための基本を説明します。

## WPForms日付ピッカーの仕組みを理解する

WPFormsはFlatpickr日付スクリプトを利用して日付ピッカーを生成します。FlatpickrはJavaScriptを使用して日付ピッカーを構築します。**25**を超える言語が利用可能で、Flatpickrは豊富な言語サポートを提供しており、日付ピッカー文字列のローカライズを容易にします。

## 日付ピッカー文字列のローカライズ

ローカライズにより、WordPressサイトとそのプラグインをさまざまな言語に適応させ、世界中のユーザーにシームレスなエクスペリエンスを保証できます。以下に、WPFormsで日付ピッカー文字列を翻訳する手順を説明します。

### 1. URLと言語コードを見つける

このスニペットに必要な言語のURLを見つけるには、[Flatpickr GitHubリポジトリ](https://github.com/flatpickr/flatpickr/tree/master/src/l10n "Flatpickr l10n")に移動し、好みの言語に対応する言語ファイル（例：**スペイン語**の場合は`es`、**フランス語**の場合は`fr`）を探します。適切な言語ファイルを見つけたら、次の形式を使用してURLを構築します。

`https://npmcdn.com/flatpickr@4.6.13/dist/l10n/{language_code}.js` `{language_code}`を、選択した言語のコードに置き換えます。たとえば、フランス語にローカライズする場合は、URLは次のようになります。

`https://npmcdn.com/flatpickr@4.6.13/dist/l10n/fr.js`このURLは、選択した言語のローカライズされた日付ピッカー文字列を含む必要なJavaScriptファイルを提供します。

**注意:** 言語コードがFlatpickrのGitHubリポジトリにリストされていない場合、その言語は現在サポートされていません。

### 2. 日付ピッカーロケールの読み込み

`wpforms-datepicker-locale`をローカライズするためのURLを取得したら、次のステップはサイトにコードを追加することです。このためには、サイトにカスタムJavaScriptスニペットを追加する必要があります。

**注意:** カスタムスニペットの追加方法と場所についてサポートが必要な場合は、[WordPressにカスタムスニペットを追加する方法](https://wpforms.com/developers/how-to-add-custom-php-or-javascript-for-wpforms/)に関するチュートリアルを参照してください。

このチュートリアルではフランス語を使用するため、以下のスニペットでは、スクリプト`https://npmcdn.com/flatpickr@4.6.13/dist/l10n/fr.js`をエンキューしていることがわかります。ローカライズしたい言語に合わせてスクリプトを更新する必要があります。

上記のスニペットは、サイトのフォームに日付/時刻フィールドがあるかどうかを確認し、デフォルトのWPForms日付ピッカーロケールを指定されたものに一致するように変更します。

### 3. ローカライズの適用

2番目のステップは、JavaScriptを介して行われる日付ピッカーへのローカライズの適用です。以下のコードスニペットをサイトに追加してください。

ユーザーがフォームで日付ピッカーを開くと、文字列は指定した言語に翻訳されます。

![これらの2つのスニペットを使用すると、日付ピッカーをローカライズできます](https://wpforms.com/wp-content/uploads/2022/11/wpforms-localize-date-picker.jpg)## 条件付きロジックの追加（オプション）

サイトでWPMLプラグインを使用している場合、日付ピッカーのローカライズモジュールを条件付きで読み込むことができます。これにより、ユーザーが特定のロケールを表示している場合にのみ日付ピッカー文字列が変更されます。以下の例は、ユーザーがページのスペイン語バージョン（es）を表示したいと指定した場合にのみローカライズを適用します。

## よくある質問

以下に、WPFormsで日付ピッカー文字列を翻訳することに関する一般的な質問に回答します。

#### Q: 日付を選択したときに、正しい形式で表示されないのはなぜですか？

**A:** このスニペットを使用すると、日付ピッカーの月と日のみがローカライズされます。日付が表示される形式を変更したい場合は、[代わりにこのチュートリアルを確認してください](https://wpforms.com/developers/how-to-create-additional-formats-for-the-date-field/ "日付フィールドの追加フォーマットの作成方法")。

これで、**日付ピッカー**のテキストを正常にローカライズできました。

**日付/時刻**フォームフィールドをカスタマイズしたいですか？[日付時刻フィールドの日付オプションのカスタマイズ方法](https://wpforms.com/developers/customize-the-date-time-field-date-options/ "日付時刻フィールドの日付オプションのカスタマイズ方法")に関するチュートリアルをご覧ください。

## 参考アクション

- [wp\_enqueue\_scripts](https://developer.wordpress.org/reference/hooks/wp_enqueue_scripts/ "wp_enqueue_scriptsアクションの使用")
- [wpforms\_wp\_footer\_end](https://wpforms.com/developers/wpforms_wp_footer_end/ "wpforms_wp_footer_endアクションの使用")

**カテゴリ:** フィールド

**タグ:** JS, ローカライズ, PHP

---</body></html>