> ## Documentation Index
> Fetch the complete documentation index at: https://docs.flextell.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# Web sitesi sohbet widget'ı

> Web sitesi kanalı oluşturmayı, widget görünümünü ayarlamayı, gömme kodunu sitenize eklemeyi, token yenilemeyi ve ziyaretçi deneyimini anlatır.

Web sitesi sohbet widget'ı, sitenizin köşesinde duran bir sohbet balonudur. Ziyaretçiler balona tıklayıp yazar, mesajları Flextell'de **Sohbetler** ekranına düşer. Bu sayfa kanalı oluşturmayı, görünümünü ayarlamayı ve kodunu sitenize eklemeyi anlatır.

<Info>
  Bu işlemler **Bağlantılar → Entegrasyonlar** ekranından yapılır. Kanalı oluşturmak ve düzenlemek için **Mesajlaşma Kanalları** grubunda **Oluştur** ve **Güncelle** izinlerine sahip olmanız gerekir. Ayrıca şu iki işlem kendi iznine bağlıdır:

  * **Embed Script** düğmesi için **Bağlantı kopyalama** (**Gömme Kodunu Kopyala**) izni.
  * **Token Yenile** düğmesi için **Bağlantı oluşturma** (**Bağlantı Oluştur**) izni.

  İzinleri klinik yöneticiniz **Roller** ekranından verir. Ayrıntı için [Roller ve izinlere genel bakış](/panel/baslarken/roller-ve-izinler-ozet) sayfasına bakın.
</Info>

Başlamadan önce, sitenizin HTML'ine kod ekleyebildiğinizden emin olun. Etiket yöneticisi (tag manager) kullanıyorsanız kodu oradan da ekleyebilirsiniz.

## Website kanalı oluşturma

<Steps>
  <Step title="Website kanalları penceresini açın">
    **Bağlantılar → Entegrasyonlar** ekranında **Website** kartındaki **Kanallar** düğmesine tıklayın. **Website Kanalları** penceresi açılır. Kartı bulamazsanız **Sohbet** sekmesine geçin veya **Entegrasyon ara...** kutusunu kullanın.
  </Step>

  <Step title="Kanal ekleyin">
    **Kanal Ekle** düğmesine tıklayın. **Website Kanalı Oluştur** formu açılır.
  </Step>

  <Step title="Formu doldurun">
    Alanları aşağıdaki tabloya göre doldurun.
  </Step>

  <Step title="Kaydedin">
    **Oluştur** düğmesine tıklayın. **Website kanalı oluşturuldu.** bildirimi görünür ve kanal listeye eklenir.
  </Step>
</Steps>

| Alan | Zorunlu | Açıklama |
| - | - | - |
| **Kanal ismi** | Evet | En fazla 255 karakter. |
| **Website alan adı** | Evet | Sitenizin adresini protokol ve `www` olmadan yazın, örneğin `example.com`. Yerel geliştirme için `localhost:5500` gibi port kullanabilirsiniz. Geçersiz değerde **Protokolsüz geçerli bir alan adı girin.** uyarısı çıkar. |
| **Yapay zeka sohbet modu** | Hayır | Yeni website kanalında varsayılan **Otomatik**'tir. Seçenekler: **Otomatik**, **Yarı otomatik**, **Kapalı**, **Klinik programını kullan**. |
| **Aktif** | Hayır | Varsayılan olarak açıktır. Kapalı kanallar yeni website mesajı kabul etmez. |

Yapay zeka sohbet modunun ne yaptığını [AI asistan](/panel/sohbetler/ai-asistan) sayfasında okuyabilirsiniz. Diğer kanal türleri için [Kanallar](/panel/baglantilar/kanallar) sayfasına bakın.

Widget'ı geçici olarak kapatmak istiyorsanız kanalı **Düzenle** ile açıp **Aktif** anahtarını kapatın.

## Widget ayarları

Widget'ın renklerini, yazı tipini, konumunu ve davranışını ayrı bir ekrandan ayarlarsınız.

<Steps>
  <Step title="Widget Ayarları'nı açın">
    **Website Kanalları** penceresinde kanalın satır menüsünden **Widget Ayarları**'nı seçin. Sayfa **Widget Ayarları** başlığıyla, yanında kanal adıyla açılır.
  </Step>

  <Step title="Ayarları değiştirin">
    Soldaki bölümlerden istediğinizi açıp değiştirin. Sağdaki **Canlı önizleme**, değişiklikleri kaydetmeden gösterir.
  </Step>

  <Step title="Kaydedin">
    **Kaydet** düğmesine tıklayın. **Widget ayarları kaydedildi.** bildirimi görünür.
  </Step>
</Steps>

<Note>
  Ayarları değiştirmek için **Güncelle** iznine sahip olmanız gerekir. İzniniz yoksa tüm alanlar kapalı kalır ve **Kaydet** düğmesi görünmez.
</Note>

**Başlık metni** ve **Karşılama mesajı** zorunludur. Kaydetmeden önce ikisini de doldurun. Diğer alanlar varsayılan değerleriyle çalışır.

| Bölüm | Neleri ayarlarsınız |
| - | - |
| **Genel Görünüm** | **Ana renk**, **İkincil renk**, **Arka plan rengi**, **Gölge** (**Yok**, **Küçük**, **Orta**, **Büyük**) ve **Köşe yuvarlaklığı** (0–50). |
| **Başlık Çubuğu** | **Başlık metni** (en fazla 100 karakter), başlık arka plan ve metin rengi, **Header gradyanını göster** anahtarı, **Başlık padding** (4–40). |
| **Karşılama & Davranış** | **Karşılama mesajı** (en fazla 500 karakter) ve **Otomatik açılma**. Otomatik açılmayı açınca **Gecikme (saniye)** alanı çıkar (1–60, başlangıçta 3). |
| **Mesaj Yönetimi** | **Mesaj düzenlemeye izin ver** ve **Mesaj silmeye izin ver**. Açıkken yetkili kullanıcılar klinikten gönderilen metinleri düzenleyebilir, mesaj ve dosyaları silebilir. |
| **Yazı Tipi** | **Yazı tipi** listesi ve font boyutları ile kalınlıkları. |
| **Mesajlar** | Ziyaretçi ve klinik mesaj balonlarının renkleri, köşe yuvarlaklığı, iç boşluğu ve mesajlar arası boşluk. |
| **Giriş Alanı** | **Placeholder metni** (en fazla 100 karakter), giriş alanı ve gönder butonu renkleri, köşe yuvarlaklığı. |
| **FAB Butonu** | Sohbeti açan yuvarlak butonun ikonu (**Sohbet**, **Kulaklık**, **Yardım**, **El sallama**), boyutu (40–80), renkleri, gölgesi ve **Nabız animasyonu**. |
| **Konum & Boyut** | **Konum** (**Sağ alt** veya **Sol alt**), kenar boşlukları, **Genişlik** (280–500) ve **Yükseklik** (400–800). |
| **Gelişmiş** | **Özel CSS** (en fazla 10000 karakter). |

Başlıca varsayılanlar şunlardır:

| Ayar | Varsayılan |
| - | - |
| **Ana renk** | `#4F46E5` |
| **Karşılama mesajı** | `Merhaba! Size nasıl yardımcı olabilirim?` |
| **Placeholder metni** | `Mesajınızı yazın...` |
| **Konum** | **Sağ alt** |
| **Genişlik** × **Yükseklik** | 380 × 600 |

<Tip>
  **Ana renk**'i değiştirdiğinizde başlık, ziyaretçi mesajı, gönder butonu ve FAB rengi de onunla birlikte değişir. Bunun için o renklerin ana renkle aynı kalmış olması gerekir. Önce ana rengi seçin, sonra tek tek renkleri ayrıştırın.
</Tip>

<Note>
  Widget'ın altındaki "Powered by Flextell" yazısı kapatılamaz.
</Note>

## Gömme kodunu ekleme

<Steps>
  <Step title="Kodu açın">
    **Website Kanalları** penceresinde kanalın satır menüsünden **Embed Script**'i seçin. **Website embed kodu** penceresi açılır.
  </Step>

  <Step title="Kodu kopyalayın">
    **Kodu Kopyala** düğmesine tıklayın. **Embed kodu kopyalandı.** bildirimi görünür. Kopyalama çalışmazsa kodu seçip elle kopyalayın.
  </Step>

  <Step title="Sitenize yapıştırın">
    Kodu HTML sayfanızdaki kapanış `</body>` etiketinden hemen önce yapıştırın. Widget'ın her sayfada görünmesini istiyorsanız kodu tüm sayfalarda ortak olan şablona ekleyin.
  </Step>
</Steps>

Kod şu biçimdedir. Kendi kodunuzu panelden kopyalayın, aşağıdaki değerler örnektir.

```html theme={null}
<script async src="https://<flextell-adresi>/widget/<embed_token>/embed.js"></script>
```

Kodda kanala özel bir `embed_token` bulunur. Her kanalın kodu farklıdır.

## İzinli alan adları

Widget yalnızca kanalda kayıtlı **Website alan adı**'nda çalışır. Flextell, isteğin geldiği sitenin alan adını kayıtlı alan adıyla karşılaştırır.

| Durum | Sonuç |
| - | - |
| Kayıtlı `example.com`, widget `example.com` sitesinde | Çalışır. |
| Kayıtlı `example.com`, widget `www.example.com` sitesinde | Çalışır. Baştaki `www.` ve harf büyüklüğü dikkate alınmaz. |
| Kayıtlı `example.com`, widget `shop.example.com` sitesinde | Çalışmaz. Alt alan adı farklıdır. |
| Kayıtlı alan adında port yok | Siteniz hangi portta açılırsa açılsın çalışır. |
| Kayıtlı alan adında port var, örneğin `localhost:5500` | Yalnızca o portta çalışır. |

Alt alan adı veya ikinci bir site için widget kullanacaksanız her biri için ayrı bir website kanalı oluşturun.

<Warning>
  Alan adı yanlış yazılmışsa, site farklıysa veya kanal **Aktif** değilse widget sitenizde görünmez. Kanalın alan adını **Website Kanalı**'nı **Düzenle** ile düzeltin ve kanalın **Aktif** olduğunu kontrol edin.
</Warning>

## Token yenileme

Gömme kodunun sızdığından şüphelenirseniz veya eski kodu devre dışı bırakmak istiyorsanız token'ı yenileyin. Yenilenen token ile eski kod geçersiz olur.

<Steps>
  <Step title="Token Yenile'yi seçin">
    **Website Kanalları** penceresinde kanalın satır menüsünden **Token Yenile**'yi seçin. Aynı düğme **Website embed kodu** penceresinde de bulunur.
  </Step>

  <Step title="Onaylayın">
    **Embed token yenilensin mi?** sorusuna **Token Yenile** ile yanıt verin.
  </Step>

  <Step title="Yeni kodu ekleyin">
    **Embed token yenilendi. Yeni kodu sitenize ekleyin.** bildirimi görünür ve yeni kod açılır. Eski kodu sitenizde yenisiyle değiştirin.
  </Step>
</Steps>

<Warning>
  Eski gömme kodu hemen çalışmayı durdurur ve mevcut tüm ziyaretçi oturumları geçersiz olur. Ziyaretçiler önceki sohbet geçmişini widget'ta göremez. Yeni kodu siteye ekleyene kadar widget kapalı kalır.
</Warning>

## Ziyaretçi deneyimi

Kodu eklediğinizde widget, ayarladığınız konumda sohbet balonu olarak görünür.

1. Ziyaretçi balona tıklar. Otomatik açılma açıksa pencere, ayarladığınız gecikmeden sonra kendiliğinden açılır.
2. Pencerede başlığınız ve karşılama mesajınız görünür. Başlıkta "Canlı destek" alt yazısı da görünür.
3. Ziyaretçi mesajını yazıp gönderir. Yanıt gelirken **Yazıyor...** göstergesi çıkar.
4. İlk mesajla birlikte **Sohbetler** ekranında yeni bir sohbet açılır. Kişi ad ve telefon bilgisi olmadan kaydedilir. Kliniğinizde aktif bir pipeline varsa kişi için bir Lead de oluşur.
5. Kanalın **Yapay zeka sohbet modu** **Otomatik** ise AI asistan ziyaretçiye yanıt verir. Ekibiniz sohbete **Sohbetler** ekranından katılır. Mesajlaşma için [Mesajlaşma](/panel/sohbetler/mesajlasma) sayfasına bakın.

Ekibiniz metin, medya ve konum gönderebilir. Gönderilen mesajları düzenleme ve silme, **Mesaj Yönetimi** ayarlarına bağlıdır.

Ziyaretçi aynı tarayıcıya döndüğünde sohbet geçmişini görür. Geçmiş son 100 mesajla sınırlıdır. Ziyaretçi site verilerini temizlerse, oturum 30 günü doldurursa veya token yenilenirse geçmiş görünmez.

Yapay zeka kapalıyken ziyaretçi şu mesajı görür: "Şu anda otomatik yanıt veremiyoruz. Mesajınızı bırakın, en kısa sürede dönüş yapalım." Widget açılamazsa **Widget yüklenemedi.** yazar.

## Sorun giderme

| Belirti | Olası neden ve çözüm |
| - | - |
| Widget sitede görünmüyor | Kayıtlı **Website alan adı** sitenizin adresiyle uyuşmuyor. İzinli alan adları bölümündeki kuralları kontrol edin. |
| Widget görünmüyor, kanal listede **Aktif** değil | Kanalı **Düzenle** ile açıp **Aktif** anahtarını açın. |
| Eskiden çalışan widget bir anda kayboldu | Token yenilenmiş olabilir. **Embed Script** ile yeni kodu alın ve siteye ekleyin. |
| **Embed Script** veya **Token Yenile** görünmüyor | İlgili izniniz yok. Klinik yöneticinizden isteyin. |
| **Widget ayarları yüklenemedi.** | **Yeniden Dene** düğmesine tıklayın. Sürerse kanalın bir website kanalı olduğunu kontrol edin. |

## İlgili sayfalar

<CardGroup cols={2}>
  <Card title="Entegrasyonlar" icon="plug" href="/panel/baglantilar/entegrasyonlar">
    Entegrasyon kataloğu ve kart durumları.
  </Card>

  <Card title="Kanallar" icon="messages-square" href="/panel/baglantilar/kanallar">
    Kanal türleri ve ortak kanal ayarları.
  </Card>

  <Card title="AI asistan" icon="bot" href="/panel/sohbetler/ai-asistan">
    Ziyaretçilere yapay zekanın nasıl yanıt verdiği.
  </Card>

  <Card title="Mesajlaşma" icon="message-circle" href="/panel/sohbetler/mesajlasma">
    Sohbetlere yanıt verme.
  </Card>
</CardGroup>


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.