Sohbeti kendi bağlantınızdan veya düğmenizden açma

Köşedeki sohbet balonu yerine ziyaretçileriniz sohbeti web sitenizdeki bağlantı veya düğmeden de açabilir; örneğin yan çubuktaki “Yardım ve destek” veya fiyatlandırma sayfanızdaki “Planım hakkında soru”. Sohbet penceresi bu öğenin hemen yanında açılır.

Ek kod gerekmez: Widget’ı yerleştirme bölümündeki normal yerleştirme kodu yeterlidir. Hesabınızda Proje → Yerleştirme → Sohbeti kendi bağlantınızdan açma altında kopyalanabilir örnek de bulunur.

En basit durum

#rc-open hedefine giden bağlantı:

<a href="#rc-open">Help & support</a>

Veya data-rc-open özniteliği olan düğme:

<button type="button" data-rc-open>Open chat</button>

data-rc-open yalnızca düğmelerde değil, her öğede çalışır. Widget, bağlantı hedefi olarak #rc-open yanında #reactive-chat de kabul eder.

Widget henüz tamamen yüklenmemiş olsa bile tıklama geçerlidir; pencere hazır olur olmaz açılır.

Pencerenin göründüğü yer

• Yeterli alan varsa öğenin sağında, yoksa solunda. Pencerenin üst kenarı öğeyle hizalanır.
• Her zaman tamamen görünür: Pencere görünür alanda tutulur; sayfa kaydırıldığında veya tarayıcı penceresi yeniden boyutlandırıldığında öğeyi izler.
• Dar ekranlarda (480 pikselden dar; çoğu akıllı telefon) sohbet normalde olduğu gibi tam ekran açılır. Orada öğenin yanında alan yoktur.
• Yan panel olarak: Sohbet penceresi Görünüm altında tam yükseklikte yan panel olarak ayarlıysa öğenin yanında değil, orada açılır.
• Sohbet zaten açıksa pencere son tıklanan bağlantıya taşınır.
• Sohbet kapandığında (Escape tuşuyla da) klavye odağı, açan bağlantıya veya düğmeye döner.

Pencereyi köşedeki normal konumunda açmak için data-rc-open="corner" yazın. data-rc-anchor="none" aynı şeyi yapar:

<button type="button" data-rc-open="corner">Open chat</button>

Mesaj alanını önceden doldurma

data-rc-message ile sohbet açıldığında mesaj alanında cümle hazır bulunur. Gönderilmez; ziyaretçi ekleme yapabilir, değiştirebilir veya silebilir ve kendisi gönderir.

<button type="button" data-rc-open data-rc-message="I have a question about my plan">
  Question about my plan
</button>

En fazla 200 karakter kullanılır. Sohbet bunun için sohbet sekmesine geçer.

Sekme seçme

Sohbetinizde birden fazla sekme varsa data-rc-tab, açıldığında hangisinin önde olacağını belirler:

• msg – sohbet,
• home – ana sayfa,
• help – yardım makaleleri.

<a href="#rc-open" data-rc-tab="help">Browse help articles</a>

Belirttiğiniz sekme sohbetinizde yoksa (örneğin yardım makalesi olmadan help) sohbet normal şekilde açılır.

Kendi JavaScript kodunuzdan açma

Aynı seçenekler çağrı olarak da kullanılabilir. anchor, pencerenin yanında görüneceği öğedir; message ve tab isteğe bağlıdır:

document.querySelector('#my-button').addEventListener('click', function (ev) {
  ReactiveChat('open', {
    anchor: ev.currentTarget,
    message: 'I have a question about my plan',
    tab: 'msg'
  });
});

anchor olmadan pencere normal konumunda açılır. Seçeneksiz ReactiveChat('open') eskisi gibi davranır. Öğenin kendisinde data-rc-message veya data-rc-tab varsa bunlar çağrıya da uygulanır; çağrıda açıkça ilettikleriniz önceliklidir.

Kodunuz yerleştirme kodu yüklenmeden önce çalışabilecekse önüne şu satırı ekleyin. Çağrılar kuyruğa alınır ve widget hazır olur olmaz gerçekleştirilir:

window.ReactiveChat = window.ReactiveChat || function () { (window.ReactiveChat.q = window.ReactiveChat.q || []).push(arguments); };

Hiç sohbet balonu olmadan

Sohbete yalnızca kendi bağlantılarınızdan, örneğin yan çubuktaki “Yardım ve destek” üzerinden erişilecekse iki yol vardır.

Hesabınızda: Proje → Görünüm → Marka altında Gösterim değerini Yalnızca kendi bağlantılarınızla (sohbet simgesi yok) olarak ayarlayıp kaydedin. Ayar web sitenizde değişiklik gerektirmeden uygulanır. Yine de sonrasında Proje → Kurulum altındaki yerleştirme kodunu yeniden kopyalayın: yeni kod marka renginizi içermez, böylece sayfa yüklenirken sohbet simgesi kısa süre görünmez. Widget ayarınızı sunucudan henüz alamadıysa, örneğin bağlantı yoksa veya ilk ziyarette ziyaretçi çerezleri kabul etmeden önce, sohbetin erişilebilir kalması için simge güvenlik amacıyla yine görünür.

Kodda: Simge hiç görünmemeliyse yerleştirme kodundaki data-rc-hide-launcher="true" ile sohbet balonunu gizleyin. Bu öznitelik hesabınızdaki ayardan bağımsız olarak her zaman geçerlidir:

<script src="https://cdn.reactive.chat/loader.js"
        data-rc-site-key="SITE_KEY"
        data-rc-hide-launcher="true"
        async></script>

Ardından ziyaretçilerin sohbete erişebilmesi gereken her sayfada en az bir böyle bağlantı olduğundan emin olun.

Sorun giderme

• Tıklamak adrese yalnızca #rc-open ekliyor: Widget bu sayfada yerleştirilmemiştir veya yüklenmemiştir (örneğin onay olmadan). Yerleştirme kodunun bulunduğunu kontrol edin.
• Pencere bağlantının yanında değil köşede açılıyor: Öğede data-rc-open="corner" veya data-rc-anchor="none" var mı? Tarayıcı penceresi 480 pikselden dar mı? Sohbet penceresi yan panel olarak mı ayarlı?
• Metin mesaj alanında görünmüyor: Özniteliğin adı data-rc-message; doğrudan tıklanan öğenin üzerinde bulunmalıdır.

Kodun diğer ayarları Widget’ı yerleştirme bölümünde açıklanır. Sohbette kendi teklifiniz için kart göstermeyi Sohbette tanıtım kartı bölümü açıklar.

Dokümantasyonda daha fazlası

Ayrıntılı bilgi: Script etiketi başvurusu ve JavaScript API’si. Tüm bölümler dokümantasyondadır.