アシスタント設計構成
チャット デザイン タブでは、チャットウィジェットの視覚的な外観を完全にカスタマイズして、ストアのブランディングにシームレスに統合することができます。
基本的なアイデンティティとポジショニング
アイデンティティ： ヘッダーに表示される「アシスタント名」（例：「AIアシスタント」）を定義でき、オプションで「アシスタントアバターURL」を指定することで、名前の横にカスタムロゴや画像を表示できます。
配置: 「画面上の位置」ドロップダウンを使用して、ウィジェットをストアフロントのどこに配置するかを選択します（通常は右下）。
レイアウトと寸法
ピクセル（px）、ビューポートの高さ（vh）、またはrem単位を使用して、チャットインターフェースの物理的なサイズと形状を正確に制御できます。
全体の「チャット幅」（例：400px）と「チャット最大高さ」（例：50vh）を調整します。.
「メッセージのパディング」で間隔を微調整し、「メッセージコンテナの半径」（18px）や「チャットウィンドウの半径」（12px）などの半径コントロールを使用してインターフェースの曲率を調整します。.
「チャットフォントサイズ」、「チャットヘッダーテキストサイズ」、「チャットヘッダーアイコンサイズ」の設定で、文字サイズを制御できます。.
カラーテーマ
このインターフェースには、チャットウィンドウのあらゆる要素を変更できる豊富な16進数コード選択ツールが備わっています。.
背景： メインの「チャット背景」（#FFFFFF）、「顧客メッセージ背景」、「アシスタントメッセージ背景」（#000000）をカスタマイズできます。また、「ようこそテキストエリアの背景」や「FAQの背景色」（#F9FAFB）など、特定のセクションに色を付けることも可能です。
境界線： メッセージ入力欄、FAQボックス、リンクなどの境界線を微妙に定義し、統一感のあるデザインを作成します。
よくある質問
FAQタブを使用すると、ユーザーが最初のメッセージを入力する前に表示される、あらかじめ作成された質問を作成できます。これにより、AIによる生成を必要とせずに、よくある問い合わせに即座に対応できます。.
新しい項目を作成するには、「+ FAQを追加」をクリックしてください。.
各項目について、共通の「質問」（例：「製品を米国に発送できますか？」）を入力し、リッチテキストエディタを使用して静的な「回答」（太字、斜体、下線、取り消し線）をフォーマットします。.
質問の順序はドラッグ＆ドロップで変更できます。また、鉛筆アイコンとゴミ箱アイコンを使って編集または削除することもできます。.
クイックリンク
「リンク」タブを使用すると、チャットのウェルカム画面の下部に直接ナビゲーションボタンを追加できます。これは、ユーザーを別のサポートチャネルや重要なストアページに誘導するのに最適です。.
グリッドレイアウト： まず、「グリッド列」の数を選択して、リンクの表示方法を定義します（たとえば、3に設定すると、水平方向に一列に表示されます）。
リンクの追加: 「+ リンクを追加」をクリックして新しいボタンを作成します。「リンクタイトル」（「WhatsApp」や「メール」など）を入力し、「リンクURL」（メールアドレスの場合はmailto:、電話番号の場合は直通番号など、標準形式を使用）を正確に入力します。
アイコン： リンクを視覚的に表現するために、内蔵のベクターアイコンライブラリ（封筒、電話、地球儀、カレンダーなど）から選択できます。または、「カスタム画像」の下にある「ファイルを選択」ボタンを使用して、独自のアイコンをアップロードすることもできます。
Shopifyでさらに売上を伸ばしたいですか？
ShopifyストアにLiliwiをインストールすれば、弊社チームによる無料セットアップサービスをご利用いただけます。.
フルサービスをわずか1ドルからご利用いただけます。.