ElevenLabsの会話型AIウィジェットをWixサイトに追加する方法

お客様サポートを強化し、エンゲージメントを向上させたいですか？ElevenLabsのConversational AIをWixサイトに追加する方法をお探しなら、こちらが最適です。このガイドでは、ステップバイステップでプロセスを説明し、よくある落とし穴を避ける手助けをします。

始める前に

始める前に、以下を確認してください：

1. Wixプレミアムアカウント：カスタムJavaScriptの埋め込みはプレミアムプランでのみ利用可能です。
2. ElevenLabsアカウント：会話型AIエージェントを作成するにはElevenLabsアカウントが必要です。こちらからサインアップしてください。
3. Devモードが有効なWixエディターへのアクセス：カスタムコードを追加するにはDevモードが必要です。

ステップバイステップガイド

ステップ1：ElevenLabsウィジェットの準備

1. ElevenLabsアカウントにログインします。
2. 会話型AIセクションに移動します。
3. 会話エージェントを設定し、提供されたJavaScript埋め込みコードをコピーします。

ステップ2：WixでDevモードを有効にする

1. Wixサイトをエディターで開きます。
2. トップメニューのDevモードをクリックして、カスタムコードの追加などの高度な機能を有効にします。

注意：Devモードが表示されない場合は、Wix ADI（人工デザインインテリジェンス）ではなく、完全なWixエディターを使用していることを確認してください。

ステップ3：JavaScript埋め込みコードを追加

1. Wixエディターの設定 > カスタムコードに移動します。
2. + カスタムコードを追加をクリックします。
3. ElevenLabsのJavaScriptコードを指定されたフィールドに貼り付けます。
4. コードの適用先で、すべてのページ（またはウィジェット用の特定のページ）を選択します。
5. 変更を保存して公開します。

一般的な問題とトラブルシューティング

Wixサイトに会話型AIウィジェットを追加する際に問題が発生しましたか？これらの簡単な手順で問題を解決してください。

問題1：ウィジェットが切断される、または読み込まれない

• 原因：許可リストの設定が不正確、または無料のWixプランを使用している。
• 解決策：サイトURLが許可リストから削除されているか、ElevenLabsダッシュボードで正しく設定されていることを確認してください。

問題2：JavaScriptが動作しない

• 原因：JavaScriptコードが正しく追加されていない。
• 解決策：JavaScriptがカスタムコードの正しいフィールドに貼り付けられていることを再確認してください。

問題3：無料のWixプラン

• 原因：無料のWixプランではカスタムJavaScriptの埋め込みがサポートされていません。
• 解決策：Wixプレミアムプランにアップグレードしてください。

高度なヒント

ウェブサイトの訪問者に最高の体験を提供したい場合は、これらの高度なベストプラクティスを確認してください。

許可リストの調整

コードを埋め込んでもウィジェットが動作しない場合は、次の手順に従ってください：

1. ElevenLabsアカウントにログインします。
2. 会話型AIエージェントの許可リスト設定に移動します。
3. ウェブサイトのドメインが正しく追加されていることを確認します。問題が続く場合は、ドメインを許可リストから削除して再テストしてください。

ライブドメインでのテスト

ウィジェットはWixのプレビューモードでは正しく機能しない場合があります。サイトを公開し、ライブドメインでテストして期待通りに動作するか確認してください。

クロスブラウザ互換性テスト

ウィジェットがライブになったら、Chrome、Firefox、Edge、Safariなど複数のブラウザでテストしてください。JavaScriptの処理方法の違いにより、機能がブラウザ間で異なる場合があります。

1. 各ブラウザでウェブサイトを開きます。
2. ウィジェットと対話し、その応答性を確認します。
3. スタイルの崩れや機能のエラーなどの問題を探します。問題が発生した場合は、JavaScriptコードを見直すか、ElevenLabsサポートに連絡して指導を受けてください。

モバイル対応

多くのユーザーがスマートフォンやタブレットを通じてウェブサイトにアクセスするため、ウィジェットがモバイルデバイスでシームレスに動作することを確認してください。

1. Wixのモバイルエディターを使用してサイトのモバイルレイアウトをプレビューします。
2. 実際のデバイスでウィジェットをテストし、その機能と使いやすさを確認します。
3. 重なり合う要素やフォーマットの問題を確認します。調整が必要な場合は、Wixのモバイルデザインツールを使用して配置とサイズを最適化してください。

JavaScriptデバッグのヒント

ウィジェットが期待通りに動作しない場合、ブラウザの開発者ツールが問題の特定に役立ちます。

1. ブラウザ（Chrome推奨）でサイトを開きます。
2. ページ上で右クリックし、検証を選択してDevToolsを開きます。
3. コンソールタブに移動し、ウィジェットに関連するエラーメッセージを探します。
4. エラーが表示された場合、JavaScript埋め込みコードを再確認し、必要なすべてのURLが許可リストに追加されていることを確認してください。この方法は、ウィジェットの機能を妨げる依存関係の欠如や他の問題を強調することもできます。

最終的な考え

ElevenLabsの会話型AIウィジェットをWixに統合するには、慎重な設定が必要ですが、適切な手順を踏めばすぐに稼働させることができます。Wixプレミアムプランを持ち、上記の手順に従い、必要に応じて一般的な問題をトラブルシューティングしてください。さらに問題が発生した場合は、ElevenLabsのサポートにお問い合わせください。

また、まだの場合は、今すぐサインアップして会話型AIを始めましょう。