Appearance (Görünüm) ayarları, chatbot'unuzun sohbet widget'ının web sitenizdeki ziyaretçilere nasıl görüneceğini denetler - üst bilgi alanı (header), mesajların renkleri ve yazı tipleri, başlatıcı simgesi (launcher), karşılama ekranı, widget boyutu ve daha fazlası. Widget'ınızı markanızla uyumlu hale getireceğiniz yer burasıdır.
Stilini ayarlamadan önce bir chatbot'a ihtiyacınız vardır. Henüz bir chatbot oluşturmadıysanız İlk ChatLab chatbot'unuzu oluşturma rehberiyle başlayın.
Görünüm ayarları nerede bulunur?
Chatbot'unuzu seçin ve Settings > Appearance (Ayarlar > Görünüm) bölümüne gidin. Ana ChatLab sayfasından Chatbots (Chatbot'lar) öğesine tıklayın, chatbot'unuzu açın, Settings (Ayarlar) sekmesine gidin, ardından sol menüden Appearance (Görünüm) seçeneğini belirleyin.
Sayfanın sağ tarafında widget'ınızın canlı bir önizlemesi görünür ve siz ayarları değiştirdikçe güncellenir.
Sohbet başlığı (Chat Header)
Sohbet widget'ınızın üst bölümünün nasıl görüneceğini yapılandırın:
- Chatbot name (Chatbot adı) - sohbet başlığında gösterilen görünen ad (en fazla 60 karakter)
- Tagline (Slogan) - chatbot adının altında görüntülenen isteğe bağlı alt başlık (en fazla 60 karakter)
- Avatar - müşterilerin chatbot ile etkileşim kurarken göreceği özel bir görsel yükleyin. Mevcut görseli temizlemek için Remove (Kaldır) butonunu (aşağıda vurgulanmıştır) kullanın.
- Background (Arka plan) - üst bilgi alanının arka plan rengi
- Name color (Ad rengi) - chatbot adı metninin rengi
- Tagline color (Slogan rengi) - slogan metninin rengi
- Reset conversation tooltip (Görüşmeyi sıfırla araç ipucu) - ziyaretçiler widget başlığındaki görüşmeyi sıfırla butonunun üzerine geldiğinde gösterilen araç ipucu metni (en fazla 40 karakter, varsayılan "Reset conversation")
Mesaj (Message)
Mesaj giriş alanını ve görüşme mesajlarının görünümünü özelleştirin:
- Input placeholder (Giriş alanı yer tutucusu) - widget'ın altındaki yeni mesaj giriş alanında gösterilen yer tutucu metin (en fazla 50 karakter, varsayılan "Type a message..."). Ziyaretçileri yazmaya teşvik etmek için kullanın.
- User background (Kullanıcı arka planı) - ziyaretçi tarafından gönderilen mesajların arka plan rengi
- User text (Kullanıcı metni) - ziyaretçi mesajlarının metin rengi
- Resp. background (Yanıt arka planı) - chatbot yanıtlarının arka plan rengi
- Response text (Yanıt metni) - chatbot yanıtlarının metin rengi
Mesaj metin boyutu, widget yazı tipiyle birlikte Typography (Tipografi) bölümünde ayarlanır.
Önerilen sorular (Suggested Questions)
Önerilen sorular (Suggested questions), ziyaretçinin bir görüşmeyi başlatmak için dokunabileceği hazır komutlardır. Soruların kendilerini Settings > Chat Conversation (Ayarlar > Sohbet Görüşmesi) bölümünde yazarsınız; burada ise butonların nasıl görüneceğini biçimlendirirsiniz:
- Background (Arka plan) - önerilen soru butonlarının arka plan rengi
- Text (Metin) - önerilen soru butonlarının metin rengi
- Stack (Alt alta sırala) - etkinleştirildiğinde, daha uzun önerilen sorular yatay bir kaydırma çubuğu göstermek yerine dikey olarak alt alta sıralanır
Önerilen soruların metin boyutu Typography bölümünde ayarlanır.
Simge durumuna küçültülmüş mod ayarları
Sohbet penceresi simge durumuna küçültüldüğünde (ziyaretçi sohbeti açmadan önce) pencere bileşeninin nasıl görüneceğini kontrol edin:
- Minimized display mode (Küçültülmüş görünüm modu) - aşağıdakiler arasından seçim yapın:
- Icon - standart dairesel sohbet başlatıcı simgesi (varsayılan)
- Minified chat bar - sayfanın alt kısmında gösterilen kompakt metin giriş çubuğu
- Icon with text - daha geniş, hap şeklinde bir başlatıcı: simge ve yanında iki satırlık kısa bir açıklama
- Icon color / Mini bar color (Simge rengi / Mini çubuk rengi) - başlatıcı simgesinin veya mini çubuk arka planının rengi
- Custom chat icon (Özel sohbet simgesi - yalnızca simge modunda) - özel açma/kapatma sohbet simgeleri yüklemek için etkinleştirin
- Position on screen (Ekrandaki konum) - pencere bileşenini ekranın sol veya sağ tarafına yerleştirin
- Move up chat icon/bar by (Sohbet simgesini/çubuğunu yukarı taşı) - alt kenardan piksel cinsinden dikey uzaklık
- Move icon/bar left/right by (Simgeyi/çubuğu sola/sağa taşı) - en yakın ekran kenarından piksel cinsinden yatay uzaklık
Metinli simge (Icon with text)
Icon with text modu başlatıcıya kısa bir açıklama ekler, böylece ziyaretçiler sohbeti açmadan önce ne amaçla kullanıldığını görebilir. Tek başına bir simgenin yeterince belirgin olmadığı durumlarda faydalıdır - örneğin "Bize yazın / Hemen yanıtlayalım" veya "Yardım mı lazım? / Asistanımıza danışın".
Bu modun seçilmesi dört ayar ekler:
- Label line 1 (1. satır etiketi) - açıklamanın ilk ve daha belirgin satırı (en fazla 60 karakter)
- Label line 2 (2. satır etiketi) - ikinci ve daha hafif satır (en fazla 60 karakter). Tek satırlı bir başlatıcı için boş bırakın
- Text color (Metin rengi) - açıklamanın rengi. Değiştirmezseniz ChatLab, başlatıcı renginizin açıklık veya koyuluğuna göre siyah ya da beyazı otomatik olarak seçer
- Show close cross (Kapatma çarpısını göster) - ziyaretçilerin gizleyebilmesi için başlatıcıya küçük bir çarpı simgesi ekler
Her iki satır da sığmadığı takdirde üç nokta ile kısaltılır; böylece başlatıcı asla ekrandan daha geniş hale gelmez. Sohbet açıkken başlatıcı tekrar dairesel bir görünüme küçülür.
Eğer çoklu dil desteği etkinse, her iki açıklama satırı da ziyaretçiye dönük diğer metinler gibi çevrilir.
Show close cross varsayılan olarak kapalıdır ve yalnızca bu modda kullanılabilir. Etkinleştirildiğinde, çarpıya tıklayan bir ziyaretçi tarama oturumunun geri kalanı boyunca başlatıcıyı gizler - sayfalar arasında gezinirken gizli kalır ve sonraki ziyaretinde ya da yeni bir sekmede tekrar görünür. Otomatik açılacak şekilde ayarlanmış bir chatbot bu tercihe uyar ve ziyaretçi kapattıktan sonra tekrar açılmaz.
Sayfa yüklendikten sonra sohbet widget’ını otomatik açma
Sohbetin, ziyaretçiler sayfayı yüklediğinde otomatik olarak açılmasını sağlayın:
- Auto open on mobile (Mobilde otomatik aç) - sohbeti mobil cihazlarda otomatik olarak açar
- Auto open on desktop (Masaüstünde otomatik aç) - sohbeti masaüstü ekranlarda otomatik olarak açar
- Open chat with delay (Sohbeti gecikmeyle aç) - otomatik açılmadan önce bir gecikme süresi belirler (yalnızca otomatik açma etkinleştirildiğinde kullanılabilir)
- Delay by (Gecikme süresi) - açılmadan önce beklenecek saniye sayısı (0-60 saniye)
İnsan benzeri mesajlaşma (Human-Like Messaging)
Yanıtları cümle cümle kademeli olarak gösterilen birden fazla mesaj balonuna bölerek insan benzeri yazma deneyimini simüle eder:
- Human-Like Messaging - özelliği açıp kapatmak için geçiş anahtarı
- Delay Between Bubbles (Balonlar arası gecikme) - her mesaj balonunun görüntülenmesi arasındaki saniye cinsinden süre (0-200 saniye)
Karşılama mesajı balonu (Welcome Message Bubble)
Ziyaretçilerin sohbeti fark etmesine yardımcı olmak için karşılama mesajını sohbet başlatıcı simgesinin üzerinde bir balon içinde görüntüleyin. Bu özellik yalnızca simge modunda kullanılabilir; iframe modunda veya otomatik açma etkinleştirildiğinde çalışmaz.
- Show on desktop (Masaüstünde göster) - karşılama mesajı balonunu masaüstünde görüntüler
- Show on mobile (Mobilde göster) - karşılama mesajı balonunu mobil cihazlarda görüntüler
- Delay (Gecikme) - sayfa yüklendikten sonra balonun gösterilmesine kadar geçecek saniye sayısı (0-60 saniye)
Birden fazla karşılama mesajınız varsa, sohbet simgesinin üzerinde üst üste yığılmış olarak görünürler.
Sesli giriş (sohbet giriş alanındaki mikrofon butonu) Appearance altında değil, Settings > Chat Conversation bölümünde yapılandırılır.
Karşılama ekranı (Welcome Screen)
Widget'ı, yeni ziyaretçileri büyük bir karşılama mesajı ve ortalanmış beyaz bir kart üzerinde alt alta sıralanmış önerilen sorularla karşılayan özel bir açılış düzenine geçirin. Karşılama ekranı yalnızca yeni bir oturumun başlangıcında görünür ve ziyaretçi ilk mesajını gönderir göndermez standart sohbet görünümüne geçer.
- Special Welcome Screen (Özel Karşılama Ekranı) - karşılama ekranı modunu açar veya kapatır (varsayılan olarak kapalıdır)
- Suggested questions intro (Önerilen sorular giriş metni) - karşılama ekranındaki önerilen sorular kartının üzerinde gösterilen kısa etiket (örneğin, "Bir seçenek belirleyin veya bir mesaj yazın"). Etiketi gizlemek için boş bırakın. Önerilen soruların Settings > Chat Conversation bölümünde yapılandırılmış olmasını gerektirir.
- Hide Human Contact Form (İnsan İletişim Formunu Gizle) - karşılama ekranı görüntülenirken başlıktaki iletişim formu eylemini gizler
- Hide Live Chat (Live Chat'i Gizle) - karşılama ekranı görüntülenirken başlıktaki canlı sohbet eylemini gizler
Karşılama ekranı ayrıca Lead Collection (Müşteri Adayı Toplama) ve Privacy Policy consent (Gizlilik Politikası onayı) ile entegre çalışır - görüşme başlangıcında bunlardan biri gerekliyse, form veya onay istemi önerilen sorular yerine karşılama kartında gösterilir.
Tüm ayrıntılar, düzen seçenekleri ve ziyaretçi tarafı ekran görüntüleri için bkz. Welcome Screen.
Başlık eylemleri (Header Actions)
Live Chat ve Human Contact Form (İnsan İletişim Formu) seçeneklerinin sohbet widget'ı başlığında nasıl sunulacağını denetler.
- Separate icons (Ayrı simgeler) - her eylem başlıkta, kapatma butonunun yanında kendi simgesini alır
- Menu (dropdown) (Menü - açılır liste) - her iki eylem de başlık menüsüne (üç nokta simgesi) taşınır; bunlar etkinleştirildiğinde "Görüşmeyi sıfırla" ve dil değiştirici gibi öğelerin yanında yer alır
Yeni chatbot'lar, daha fazla eylem eklendikçe başlığın düzenli kalmasını sağlayan menü seçeneğini kullanır. 2 Eylül 2026'dan önce oluşturulan chatbot'lar ayrı simgeleri korur, böylece ziyaretçileri için hiçbir şey değişmez. İstediğiniz zaman geçiş yapabilirsiniz - bu ayar yalnızca sunumu etkiler, eylemlerin işlevini değiştirmez.
Tipografi (Typography)
Mesajlar, önerilen sorular, başlık, formlar ve başlatıcı metni dahil olmak üzere tüm widget genelinde kullanılan yazı tipini ve metin boyutlarını ayarlar.
- Widget font (Widget yazı tipi) - sekiz yazı tipinden biri: System default (Sistem varsayılanı), Inter, Nunito, Lato, Montserrat, Poppins, Source Serif ve JetBrains Mono
- Message font size (Mesaj yazı tipi boyutu) - mesaj metninin boyutu (12-24 px)
- Suggested questions font size (Önerilen sorular yazı tipi boyutu) - önerilen soru butonlarının boyutu (12-24 px)
Inter varsayılandır ve bu ayar sunulmadan önce tüm chatbot'ların sahip olduğu görünümle eşleşir; bu nedenle siz başka bir yazı tipi seçene kadar hiçbir şey değişmez.
System default hiçbir şey indirmez - widget, ziyaretçinin cihazında zaten yüklü olan yazı tipini kullanır. Bu da onu en hızlı seçenek yapar ve sistem yazı tipini kullanan sitelerle kusursuz bir uyum yakalar; ancak sohbet Windows, macOS ve Android'de biraz farklı görünecektir. Diğer yedi yazı tipi, ziyaretçinin tarayıcısı tarafından bir kez indirilen Google Fonts yazı tipleridir. Her birinin bir yedek yazı tipi (fallback) vardır; bu sayede bir ziyaretçinin ağı Google Fonts'u engellese bile metin okunabilir kalır ve düzen bozulmaz.
Yazı tipi dosyası doğrudan sohbet penceresine yüklenir. Kendi sayfanıza yalnızca widget sohbet penceresinin dışında metin gösterdiğinde eklenir - Icon with text başlatıcısı, küçültülmüş sohbet çubuğu veya karşılama mesajı balonları gibi. Düz simge başlatıcısını kullanan bir chatbot sayfanıza fazladan hiçbir istek yüklemez.
Widget boyutu (Widget Size)
Masaüstü ve mobil cihazlarda açık sohbet penceresinin ne kadar büyük görüneceğini ayarlayın. Her kaydırıcının yanında, yerleşik boyutlandırmayı geri yükleyen bir Default (Varsayılan) butonu bulunur.
- Desktop width (Masaüstü genişliği) - piksel cinsinden masaüstü tarayıcılarındaki widget genişliği (330-800, varsayılan 448)
- Desktop height (Masaüstü yüksekliği) - piksel cinsinden masaüstü tarayıcılarındaki widget yüksekliği (300-770, varsayılan 660)
- Mobile size (Mobil boyut) - mobil cihazlarda ekranın yüzdesi olarak widget boyutu (%60-100, varsayılan %100)
Varsayılan değerde widget, ChatLab'in yerleşik duyarlı (responsive) boyutlandırmasını kullanır. Diğer tüm değerler sabit bir boyut uygular.
Mobilde varsayılan değer (%100), açık sohbetin tüm ekranı kaplamasını sağlar. Daha düşük bir yüzde seçtiğinizde widget ekranın ilgili oranına küçülür ve görünüm alanında ortalanır; böylece ziyaretçiler sohbetin etrafındaki sayfayı görmeye devam edebilir.
Kaydırıcıların yanında (aşağıda vurgulanan) iki adet Save & Preview (Kaydet ve Önizle) butonu göreceksiniz; biri masaüstü satırları, diğeri ise mobil satırı içindir. Bir butona tıkladığınızda kaydedilmemiş değişiklikler kaydedilir ve ardından sohbet, mevcut ayarlarınız kullanılarak bir önizleme penceresinde açılır:
- Masaüstü butonu, masaüstü ekranındaki tam boyutu görebilmeniz için normal bir tarayıcı penceresi açar.
- Mobil butonu, widget'ın mobil düzeninde görüntülenmesi için kompakt bir açılır pencere (400 x 700) açar; bu, masaüstü bir bilgisayardan Mobile size kaydırıcısını ayarlarken oldukça kullanışlıdır.
Büyütme butonu (çekmece modu / Drawer Mode)
Çekmece modu (Drawer mode), ziyaretçinin sohbeti kayan bir pencereden, ekranın kenarına sabitlenmiş ve sayfanızın yanında görünmeye devam ettiği tam yükseklikte bir panele dönüştürmesine olanak tanır. Ziyaretçinin sayfayı okurken takip ettiği uzun yanıtlar, ürün karşılaştırmaları, formlar veya yoğun metin içeren her türlü konuşma için idealdir.
Widget Size (Widget Boyutu) bölümünde Maximise button (Büyütme butonu) seçeneğini etkinleştirdiğinizde sohbet başlığında bir buton görünür; bunu kullanıp kullanmama kararı ziyaretçiye aittir. Yaptıkları seçim, mevcut tarama oturumunun geri kalanı boyunca hatırlanır.
- Panel, tarayıcı penceresinin yarısı genişliğinde (en fazla 720 px) ve her zaman tam yüksekliktedir. Başlatıcınızla (launcher) aynı tarafa kenetlenir; yani sol tarafa konumlandırılmış bir widget, çekmeceyi sol tarafta açar.
- Desktop width ve Desktop height burada geçerli değildir; bunlar yalnızca normal kayan pencereyi boyutlandırır.
- Buton yalnızca fare kullanan ve en az 1200 px genişliğindeki masaüstü ekranlarda gösterilir. Telefonlarda ve tabletlerde hiç görünmez çünkü sohbet orada zaten tüm ekranı kaplar. Ziyaretçi tarayıcıyı bu genişliğin altına küçülttüğünde, çekmece tekrar normal pencereye dönüşür.
- Çekmece açıkken başlatıcı gizlenir; ziyaretçi pencereyi başlıktan kapatabilir veya aynı butonla çekmece modundan çıkabilir.
Çekmece modu varsayılan olarak kapalıdır, bu nedenle siz etkinleştirene kadar ziyaretçileriniz için hiçbir şey değişmez.
Diğer görünüm ayarları
- Widget Shadow (Widget Gölgesi) - sohbet widget'ı kapsayıcısının etrafındaki gölgeyi etkinleştirin veya devre dışı bırakın
- Open links in (Bağlantıları şurada aç) - sohbet mesajlarındaki bağlantıların yeni sekmede mi yoksa aynı sekmede mi açılacağını seçin
Masaüstünde sohbet başlığında bir kapatma (X) butonu da gösterilir; böylece ziyaretçiler sayfayı yeniden yüklemeden sohbeti başlatıcı simgesine geri daraltabilir. Sohbet bir iframe olarak veya tam ekran modunda yerleştirildiğinde kapatma butonu gizli kalır.
Özel sohbet altbilgisi (Custom Chat Footer)
Sohbet widget'ının altında görüntülenecek özel bir metin ekleyin (en fazla 250 karakter). Bağlantı eklemek için Markdown desteklenir. Yaygın bir kullanım alanı, gizlilik politikanıza veya hizmet şartlarınıza bağlantı vermektir.
Örnek markdown:
By chatting you accept our [Privacy Policy](https://www.example.com)
Özel CSS (Custom CSS)
Sohbet widget'ınızın görünümünü daha da özelleştirmek için özel CSS stilleri ekleyin (en fazla 5000 karakter):
İlgili makaleler
Değişiklikler otomatik olarak kaydedilir. Saved (Kaydedildi) ifadesini bekleyin, ardından masaüstü ve mobilde Overview (Genel Bakış) ekranını ve sitenize gömülü widget'ı kontrol edin. Ayarlar önizlemesi sohbet penceresini gösterir; başlatıcı yerleşimi ve sayfa düzeyinde otomatik açılma davranışı da website embed (web sitesi yerleştirmesi) üzerinde kontrol edilmelidir.
- İlk chatbot'unuzu nasıl oluşturursunuz?
- Conversation settings (Konuşma ayarları) - karşılama mesajını ve önerilen soruları yazın
- Welcome Screen (Karşılama Ekranı) - tam ekran açılış düzeni ve ziyaretçi tarafındaki varyantları
- Özel formlar - sohbet içinde ziyaretçi bilgilerini toplayın
- Lead toplama