# AX - 言語セレクター

## 概要

**AX - 言語セレクター** Experience Cloud コンポーネントで、Experience Sites のページに言語ピッカーを表示し、ポータルユーザが利用可能な言語間で切り替えられるようにします。

国際的な顧客やパートナー向けに多言語サポートを提供するために使用します。コンポーネントは Experience Site に設定されているすべての有効な言語を表示し、ユーザが別の言語を選択するとページコンテンツを更新します。

グローバルなカスタマーポータル、国際的なパートナーサイト、複数地域のサポートセンター、または異なる言語を話すユーザに対応するあらゆるポータルに最適です。

<details>

<summary>🔀 Salesforce 標準の言語セレクターと Avonni 言語セレクターの違い</summary>

Avonni 言語セレクターは、標準の Salesforce 言語セレクターを上回り、以下を提供します:

1. **言語のグループ化:** 地域別やその他の基準で言語を整理し、使いやすい体験を提供します。
2. **ビジュアルのカスタマイズ:** セレクターの見た目をウェブサイトのデザインに合わせて調整できます。
3. **高度な機能性:** メニューヌビンのカスタマイズや柔軟なメニュートリガーなど、標準セレクターにはない機能を利用できます。

Avonni 言語セレクターを使えば、機能的で視覚的にも魅力的、かつウェブサイトの独自のアイデンティティに完全に調和した多言語体験を作成できます。

</details>

## **準備: 基本設定**

### **ラベル**

* 言語選択メニューの上に表示するラベルをカスタマイズします。
* あるいは「現在の言語をラベルとして使用」オプションを切り替えて、現在選択されている言語を動的にラベルとして表示することもできます。

<figure><img src="https://9391847-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FDL6JQuZArjJeQvX2ot4y%2Fuploads%2FfQoA5SuFjgSdQInI9EQC%2F2024-07-05_16-04-11.png?alt=media&#x26;token=a5874a43-fb1e-473a-b4a9-ccb78fde5b6f" alt="" width="563"><figcaption></figcaption></figure>

### **言語グループ**

* 言語グループ機能を使って複数の言語を別々の列に整理します。
* 選択する言語がサイト上で有効かつ利用可能であることを確認してください。

<figure><img src="https://9391847-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FDL6JQuZArjJeQvX2ot4y%2Fuploads%2FWw5aInrhSZNR5WZ1SWGt%2F2024-07-05_16-21-42.png?alt=media&#x26;token=aaf9940d-e73b-4c08-afc7-1cd036ac1816" alt="" width="306"><figcaption></figcaption></figure>

## **ビジュアルのカスタマイズ**

### **アイコン名とサイズ**

言語の多様性を示すシンボル（例えば地球儀）を選び、サイトの美観に合うようサイズを調整します。

### **バリアント**

サイトの美観に合う視覚スタイル（bare、bare-inverse、base、border、border-filled など）を選択します。

### **メニューの位置合わせ**

サイトの美観に合う視覚スタイル（bare、bare-inverse、base、border、border-filled など）を選択します。

## **メニューの動作**

### **メニュートリガー**

訪問者はボタンをクリック、ホバー、またはフォーカスして言語オプションを表示しますか？ターゲットにとって直感的な操作方法を選んでください。

### **メニューヌビン**

この小さな矢印は、メニューがコンポーネントへ向かっていることを示す、方向を示すささやかな装飾です。

### **メニュータイトル**

明確さのためにメニューにわかりやすいタイトル（例：「言語を選択」）を付けてください。

## **役立つヒントとアクセシビリティ**

### **ツールチップ**

ユーザがコンポーネントにホバーしたときに、短い説明や指示をツールチップで提供します。

### **下矢印を非表示にする**

ドロップダウンに通常付随する下向き矢印アイコンを、よりすっきりした見た目にしたい場合は非表示にできます。

### **ストレッチ**

このオプションはコンポーネントを拡張してコンテナ全体を埋めることを可能にし、洗練された外観を保証します。

### **無効化**

必要に応じて言語選択機能を一時的に無効にできます。

### **水平方向の配置**

コンポーネントをコンテナ内で水平方向に配置する（左、中央、右）設定を制御します。

Avonni 言語セレクターを使えば、Experience Cloud サイトがグローバルな訪問者にとって歓迎されるハブになります。訪問者は好みの言語を簡単に選択でき、コンテンツをスムーズかつ快適に閲覧できます。
