script内の以下コードの値を変更し位置を変更します。StyleOptions > ConversationContainer > right, left, bottom の値を変更できます。 デフォルト値は５０となっています。
ドラッグアンドドロップでトグルアイコンが移動しないようにするには、disableToggleDragをtrueに設定します。
{% code lineNumbers="true" %}
```javascript
Alli.initialize({
disableToggleDrag: false, // optional, default: false
styleOptions: { // optional, to customize style.
conversationContainer: {
right: 50, // offset from the right (applied when SDK position is set to right on project settings)
left: 50, // offset from the left (applied when SDK position is set to left on project settings)
bottom: 50 // offset from the bottom
}
}
});
```
{% endcode %}
### **＜トグルアイコンとプレビューなしで全画面でAlliウィンドウをロードする＞**
スマートフォンのブラウザなどの小さな画面にAlliをロードするなどの場合には、トグルアイコンとプレビューを省略してすぐにフルスクリーンでチャットUIを読み込む必要がときがあります。以下のようにpopupModeとlauncherを使用します。
{% code lineNumbers="true" %}
```javascript
Alli.initialize({
popupMode: true,
launcher: false,
});
```
{% endcode %}
popupModeがtureに設定されると、Alliはプレビューなしですぐに画面全体のチャットUIでロードされます。launcherがfalseに設定されると、切り替えのアイコンをロードしません。
### **＜ユーザーを特定する＞**
ユーザIDで特定されないユーザの場合、Alliはcookieを使用して情報を保存します。cookie履歴を削除したり、他のデバイスを使用して接続する場合は、ユーザを特定することはできません。
ウェブサイトにログインし、ユーザが特定されている場合、Alliに情報を渡すことができます。あるいはログインしていないユーザーのために、一時的なIDを生成することもできます。
例えば、ユーザIDがUSER-123の場合は、次のように入力します。
{% code lineNumbers="true" %}
```javascript
window.Alli.event({
user: {id: "USER-123"}
});
```
{% endcode %}
電子メール、アドレスなどのユーザー情報を送信する場合は、下記の「変数に値を割り当てる」セクションを参照してください。
### **＜変数の値を指定する＞**
会話を開始するとき、特定の変数の値を変数に割り当てる場合は、以下の形式を使用します。
{% code lineNumbers="true" %}
```javascript
window.Alli.event({
variables: {
"VARIABLE_NAME":"VARIABLE_VALUE"
}
});
```
{% endcode %}
この機能を利用すれば、特定のユーザ情報をAlliの変数に格納して利用することができます。この変数は、Alliダッシュボード（プロジェクト設定＞変数）にすでに存在している変数である必要があります。
以下は、指定したユーザーにメールを割り当てる例です。
{% code lineNumbers="true" %}
```javascript
if (window.Alli) {
window.Alli.event(
{
user: {id: "YOUR_USER_ID"},
variables: {
"EMAIL":"email_address@gmail.com"
}
}
);
}
```
{% endcode %}
### **＜Placements＞**
[プレイスメント](/alliyzgaido/skills/skill-dashboard.md)情報を設定することで、Alli SDKを特定のキャンペーンチャットフローを任意のWEBサイト（アプリ）に実装することができます。
### **＜静的な配置＞**
Placementを作成した後、Alliダッシュボードで必要なキャンペーン（スキル）にPlacementを指定することができ、この方法で必要な場所にキャンペーン（スキル）をロードすることができます。 以下はPlacementをshoppingに呼び出す例です。
例：プレイスメント＝shopping
{% code lineNumbers="true" %}
```javascript
window.Alli.event({
placement: "shopping"
});
```
{% endcode %}
### **＜動的な配置＞**
Alli SDKは、URL情報を自動的に送り出し、これを利用して、動的Placementを設定することができます。そのためには、単にPlacement情報の呼び出しを省略して、ダッシュボードで、次のように設定します。 たとえば、「/ download」が含まれているurlでスキル（キャンペーン）を呼びだしたい場合は、以下の様にスキルのPlacement設定を「contains 」・「download」に指定します。SPA（Single Page App）は、動的Placementを使用することはできません。
### **＜音声認識を有効にする＞**
音声をテキストに変換することができるように音声認識を有効にします。 まず、Alliを初期化する前に以下を追加します。
{% code lineNumbers="true" %}
```javascript
var recognition = new Alli.__CustomSpeechRecognition__('wss://task.ecs-backend.alli.ai:3000/', { path: '/stt' });
recognition.interimResults = true;
recognition.maxAlternatives = 10;
recognition.continuous = true;
```
{% endcode %}
初期化する際に他のオプションがあれば、一緒に以下を追加します。
{% code lineNumbers="true" %}
```javascript
Alli.initialize({
recognition: recognition
});
```
{% endcode %}
音声認識が正常に有効になると、テキスト入力フィールドと送信アイコンの間にマイクアイコンが表示されます。アイコンをクリックすると、音声入力が可能な状態となり、もう一度押すと停止します。
### **＜音声認識を無効にする＞**
**音声認識を非表示にする場合は、Alliを起動するサイトに埋め込んでいるJavaScript SDKの一部を下記のように変更いただけると可能になります。**
#### 変更前
{% code lineNumbers="true" %}
```javascript
Alli.initialize({
apiKey: "御社環境のAPIキー",
```
{% endcode %}
#### 変更後
{% code lineNumbers="true" %}
```javascript
Alli.initialize({
apiKey: "御社環境のAPIキー",
recognition: null,
```
{% endcode %}
## サポートしているブラウザ
* Chrome （バージョン64以降）
* FireFox （バージョン60以降）
* Opera（バージョン50以降）
* Safari （10以降）
* Microsoft Edge （バージョン40以降
---
# Agent Instructions: Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.
Perform an HTTP GET request on the current page URL with the `ask` query parameter:
```
GET https://docs.allganize.ai/alliyzgaido/settings/javascript-sdk-integration.md?ask=
```
The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.
Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.