Penyesuaian HTML Messenger Dialogflow CX

Ada banyak penyesuaian HTML yang dapat Anda terapkan pada dialog chat.

Opsi elemen chat HTML

Elemen turunan dari elemen df-messenger dapat berupa:

  • df-messenger-chat: dialog agen selalu terbuka
  • df-messenger-chat-bubble: dialog agen dapat dibuka atau ditutup dengan tombol balon buka atau tutup

Penyesuaian HTML untuk df-messenger

Elemen HTML df-messenger memiliki atribut berikut:

Atribut Kebijakan input Nilai
agent-id Wajib ID Agen yang terkait dengan agen Dialogflow CX.
allow-feedback Opsional Setel ke all untuk mengizinkan pengguna akhir memberikan masukan tentang jawaban agen.
language-code Wajib Kode bahasa default.
project-id Wajib Project ID untuk agen.
location Opsional Wilayah agen. Nilai defaultnya adalah global.
intent Opsional Peristiwa kustom yang akan dipanggil saat dialog chat dibuka. Anda dapat menggunakan pengendali peristiwa yang akan dipanggil untuk peristiwa ini dan akan menghasilkan pesan agen pertama.
oauth-client-id Opsional Diperlukan untuk autentikasi OAuth. Nilai defaultnya adalah null. Jika nilai tidak diberikan dan akses tidak diautentikasi Dialogflow CX Messenger diaktifkan, pengguna yang tidak diautentikasi dapat berinteraksi dengan agen. Jika nilai diberikan, dialog agen akan ditimpa dengan notifikasi "Minta Autentikasi" (teks dapat dikontrol, lihat notifikasi request-auth-text), yang mengharuskan pengguna login sebelum dapat menggunakan agen.
storage-option Opsional Menentukan penyimpanan lokal untuk pesan percakapan. Gunakan none jika pesan tidak boleh disimpan. Menggunakan none akan menghapus semua pesan saat halaman dimuat ulang atau dimuat kembali. Nilai defaultnya adalah sessionStorage.
session-ttl Opsional Disetel ke durasi dalam detik untuk mempertahankan sesi, harus di bawah 86400 (1 hari) dan defaultnya adalah 1800 (30 menit).
url-allowlist Opsional Memungkinkan gambar dimuat dari daftar awalan URL yang dipisahkan koma. URL gambar yang digunakan dalam respons HTML atau Markdown harus dimulai dengan salah satu awalan yang tercantum. Gunakan * untuk mengizinkan semua URL.
max-query-length Opsional Menentukan panjang maksimum untuk kueri teks. Jika nilainya negatif, panjangnya tidak terbatas. Nilai defaultnya adalah 256. Dokumentasi tambahan.

Penyesuaian HTML untuk df-messenger-chat

Screenshot Dialogflow CX Messenger

Elemen HTML df-messenger-chat memiliki atribut berikut:

Atribut Kebijakan input Nilai
chat-title Opsional Judul kotak chat, yang ditampilkan di atasnya.
chat-subtitle Opsional Subjudul kotak chat, yang ditampilkan di atasnya, di bawah chat-title
chat-title-icon Opsional Ikon yang ditampilkan di judul kotak chat, yang ditampilkan di atasnya, di sebelah kiri chat-title secara default
bot-writing-text Opsional Teks yang ditampilkan saat agen sedang menulis
bot-writing-image Opsional Gambar yang ditampilkan saat agen sedang menulis. Lebih diprioritaskan daripada bot-writing-text.
request-auth-text Opsional Teks tombol jika autentikasi diperlukan.
placeholder-text Opsional Teks yang akan ditampilkan di kolom input saat kosong. Default-nya adalah "Tanyakan sesuatu…".
bot-actor-image Opsional Sumber gambar yang akan digunakan untuk gambar aktor agen. Akan ditampilkan di setiap grup respons agen.
user-actor-image Opsional Sumber gambar yang akan digunakan untuk gambar aktor pengguna. Akan ditampilkan di setiap pesan pengguna.

Penyesuaian HTML untuk df-messenger-chat-bubble

Screenshot Dialogflow CX Messenger

Elemen HTML df-messenger-chat-bubble memiliki atribut yang sama dengan df-messenger-chat dan atribut tambahan berikut:

Atribut Kebijakan input Nilai
expanded Opsional Boolean yang menentukan apakah chat awalnya terbuka. Jika tidak disetel, chat akan mengingat status terakhirnya.
chat-icon Opsional Ikon untuk balon chat. Harus berupa URI yang tersedia secara publik.
chat-close-icon Opsional Ikon tutup untuk balon chat. Harus berupa URI yang tersedia secara publik.
chat-collapse-icon Opsional Ikon untuk tombol ciutkan di kolom judul. Harus berupa URI yang tersedia secara publik.
anchor Opsional Menentukan tempat dialog chat ditempatkan relatif terhadap balon buka atau tutup. Nilainya adalah dua kata arah (top, bottom, left, right) yang dibatasi oleh -. Nilai defaultnya adalah top-left. Arah pertama menentukan titik penjangkaran, dan arah kedua menentukan arah perluasan utama dari balon. Misalnya: top-left ditempatkan di atas balon dan meluas ke kiri dan atas (menjauhi balon).
chat-width Opsional Menentukan lebar jendela chat. Nilai numerik (dalam piksel). Defaultnya adalah 320 piksel.
chat-height Opsional Menentukan tinggi jendela chat. Nilai numerik (dalam piksel). Defaultnya adalah 480 piksel.
allow-fullscreen Opsional Menentukan apakah jendela chat dapat dibuka dalam layar penuh. Jika disetel ke always, akan terbuka dalam layar penuh untuk semua ukuran layar. Jika disetel ke small, akan membuka layar penuh untuk ukuran layar di bawah 500 piksel, atau membuka sebagai jendela normal. Dapat menggantikan chat-width, chat-height, dan anchor jika ditetapkan.
minimized Opsional Menentukan apakah chat awalnya terbuka dalam bentuk yang diperkecil. Menggunakan logika yang sama dengan anchor. Akan menjalankan intent awal saat pemuatan jika ditentukan.