WebChat kurulumu

Sitenize tek satır kod ekleyerek canlı sohbet balonu açarsınız. Görünümü, karşılama metnini ve ön form alanlarını panelden ayarlarsınız.

Ön koşullar

  • Sitenizin sayfa şablonuna kod ekleyebilecek erişiminiz (yönetim paneli, tema düzenleyici veya dosya erişimi)
  • Widget’ın çalışacağı alan adı — örneğin www.orneksite.com
  • Panelde yönetici yetkisi

Adım 1 — Widget oluşturma

Panelde Kanallar bölümüne gidin ve WebChat kanalını ekleyin. Kanal oluşturulduğunda size özel bir token üretilir; bu token widget’ınızın kimliğidir.

Adım 2 — Görünüm ayarları

Widget’ın sitenizde nasıl görüneceğini belirleyen ayarlar:

AyarNe yapar
Firma adıSohbet başlığında görünen ad
Balon rengiKapalı haldeki yuvarlak balonun rengi
Başlık rengiAçılan pencerenin üst şeridinin rengi
Yazı rengiBaşlık şeridindeki yazının rengi
KonumBalonun sayfadaki köşesi
Balon boyutuBalonun büyüklüğü
Balon simgesiBalonun üzerindeki simge
Karşılama mesajıSohbet açıldığında görünen ilk metin
Firma adını gösterBaşlıkta firma adının görünüp görünmeyeceği
Kanal Ekle — WebChat Ayarları
WebChat widget görünüm ayarları ve önizleme
WebChat — rengi, karşılama metnini ve konumu ayarlayın
Renk seçerkenBalon rengini sitenizin ana rengiyle uyumlu seçin; ancak arka planla karışmayacak kadar da ayrışsın. Ziyaretçinin balonu fark edememesi en sık yapılan hatadır.

Adım 3 — Ön form alanları

Sohbet başlamadan önce ziyaretçiden bilgi isteyebilirsiniz. Ad, telefon veya e-posta gibi alanları ön form alanları olarak tanımlarsınız.

Az isteyinÖn formda ne kadar çok alan isterseniz o kadar az kişi sohbeti başlatır. Genelde yalnızca ad ve bir iletişim bilgisi yeterlidir; gerisini konuşma sırasında sorabilirsiniz.

Adım 4 — Çalışma saatleri ve otomatik yanıt

Mesai saatlerinizi tanımlayabilir, mesai dışında farklı davranış kurabilirsiniz:

  • Çalışma saatleri — hangi gün ve saatlerde ekibinizin çevrimiçi olduğunu belirler.
  • Otomatik yanıt — ziyaretçi yazdığında otomatik cevap verilmesini sağlar.
  • Yalnızca mesai dışında otomatik yanıt — bu seçenek açıkken otomatik yanıt yalnızca mesai dışında devreye girer; mesai içinde operatörleriniz yanıtlar.

Adım 5 — Telefon ve WhatsApp butonu

Balona, sohbete ek olarak doğrudan iletişim butonları ekleyebilirsiniz. Ziyaretçi yazmak yerine aramayı veya WhatsApp’tan devam etmeyi tercih edebilir.

  • Destek telefonu — numarayı girip butonu etkinleştirirsiniz.
  • WhatsApp numarası — girdiğiniz numaraya doğrudan WhatsApp bağlantısı açılır.
  • Sohbet açık/kapalı — isterseniz yalnızca bu butonları gösterip yazılı sohbeti kapatabilirsiniz.

Adım 6 — Alan adı izni

Widget yalnızca izin listesine eklediğiniz alan adlarında çalışır. Bu, kodunuzun kopyalanıp başka bir sitede kullanılmasını engeller.

Bu adımı atlamayınAlan adınız izin listesinde değilse widget sitenizde hiç görünmez. "Kodu ekledim ama balon çıkmıyor" şikâyetlerinin büyük çoğunluğunun sebebi budur.

Alt alan adları ayrı sayılır. orneksite.com ile www.orneksite.com farklı kabul edilir; ikisini de kullanıyorsanız her ikisini de ekleyin.

Adım 7 — Kodu siteye ekleme

Panelde üretilen kod tek satırdır:

kopyalanacak kod
<script src="https://chat.wi.tr/chat-gateway/widget.js" data-token="wgt_xxxxxxxx"></script>
Kanal Ekle — WebChat Kodu
Web sitesine eklenecek tek satırlık embed kodu
WebChat — tek satır kodu sitenize yapıştırın

Bu kodu sitenizin tüm sayfalarında yüklenen bir şablona, sayfa gövdesinin sonuna yakın bir yere ekleyin.

HTML sitede

Sayfanızın </body> etiketinden hemen önce yapıştırın. Birden çok sayfanız varsa ortak bir alt bilgi (footer) dosyanız varsa oraya eklemek yeterlidir.

WordPress’te

Tema düzenleyicisinde footer.php dosyasına ekleyebilir veya "başlık/altbilgi kodu ekleme" özelliği sunan bir eklenti kullanabilirsiniz. Tema güncellemelerinde kaybolmaması için eklenti yöntemi daha güvenlidir.

React, Vue gibi uygulamalarda

Uygulamanızın ana index.html dosyasına ekleyin. Bileşen içinde dinamik olarak yüklemek yerine ana HTML’e koymak en sorunsuz yoldur.

Adım 8 — Test

Sitenizi açın

Tarayıcıda sitenizi açın; sağ alt köşede (veya seçtiğiniz konumda) balonun göründüğünü doğrulayın.

Sohbet başlatın

Balona tıklayın, ön formu doldurun ve bir mesaj gönderin.

Panelde kontrol edin

Operatör panelinde WiChat sekmesinde sohbetin düştüğünü görün.

Yanıt verin

Panelden yanıt yazın; mesajın sitedeki balonda göründüğünü doğrulayın.

Örnek web sitesi
Web sitesinin sağ alt köşesindeki WebChat sohbet balonu
WebChat sitenizde böyle görünür

Sorun giderme

BelirtiOlası sebepÇözüm
Balon hiç görünmüyorAlan adı izin listesinde değilSitenizin alan adını (www’li ve www’siz halini) izin listesine ekleyin
Balon görünmüyor, konsol hata veriyorKod yanlış yere eklenmişKodun gerçekten sayfa kaynağında olduğunu, tema önbelleğinin temizlendiğini kontrol edin
Balon var ama mesaj gitmiyorSohbet kapatılmış olabilirWidget ayarlarında sohbetin etkin olduğunu doğrulayın
Mesaj gidiyor, panelde görünmüyorOperatör yanlış sekmedeOperatör panelinde WiChat sekmesine bakın
Bazı sayfalarda çıkmıyorKod ortak şablonda değilKodu tüm sayfalarda yüklenen bir şablona taşıyın
Sonraki adımWidget çalışıyorsa, ziyaretçi mesajlarını otomatik karşılamak için akış kurabilir veya yapay zeka asistanı devreye alabilirsiniz.