Ürün turları ve “Bana göster”

Açıklamak yerine gösterin: ürün turu ziyaretçilerinizi kendi sayfanızda adım adım yönlendirir. Sayfa hafifçe kararır, halka ilgili öğeyi vurgular; yanında metniniz ve Zurück (geri), Weiter (ileri), Beenden (bitir) düğmeleri bulunan balon görünür.

Tur oluşturma

/app/projects/{id} altında Metinler ve formlar sekmesinin Ürün turları bölümünde turları JSON olarak girersiniz. Boş bırakıp kaydetmek tüm turları kaldırır.

[
  {
    "id": "erste-schritte",
    "name": "First steps",
    "steps": [
      { "selector": "#konto", "title": "Your account", "text": "Change your details here." },
      { "selector": ".rechnung", "text": "And the invoices are here.", "placement": "top" }
    ]
  }
]

Turun alanları:

• id – zorunlu, benzersiz. Küçük harfler, rakamlar, - ve _; harf veya rakamla başlar, en fazla 48 karakter. Turu bununla başlatırsınız.
• name – sizin için bir ad.
• steps – 1–30 adım.

Adımın alanları:

• selector – zorunlu. Sayfanızdaki öğe için CSS seçicisi; en fazla 300 karakter.
• text – zorunlu. Balondaki metin.
• title – isteğe bağlı başlık.
• placement – bottom (varsayılan) veya top. İstektir, söz değil: balon yukarı sığmazsa aşağı taşınır.
• i18n_weiter, i18n_zurueck, i18n_fertig, i18n_ende – İleri, Geri, Tamam ve Bitir düğmeleri için isteğe bağlı kendi yazılarınız.

Sınırlar: proje başına en fazla 20 tur, toplam 32 KB. Kaydederken hesap JSON’u kontrol eder, sorun varsa hatayı belirtir.

Tur başlatma

Turları kodunuzdan, örneğin “Turu başlat” düğmesiyle veya ilk oturum açmadan sonra başlatırsınız:

ReactiveChat('tour', 'erste-schritte');

Çağrı tur başlarsa true, aksi durumda false döndürür. Şununla bitirebilirsiniz:

ReactiveChat('tourStop');

Ziyaretçi turu Beenden ile, son adımda Fertig (tamam) ile veya Escape tuşuyla bitirir. Sayaç hangi adımda olduğunu gösterir.

Öğe eksikse

Widget adımın öğesini bulamazsa, örneğin sayfada yoksa veya gizliyse, adımı atlar. Tüm öğeler eksikse tur başlamaz, çağrı false döndürür. Bu nedenle seçicilerinizi turu başlattığınız sayfanın tam kendisinde kontrol edin.

Tasarım

Turlar marka renklerinizden ve özel CSS kodunuzdan bağımsız sabit, nötr tasarıma sahiptir. Balon en fazla 320 px genişliğindedir. Kendi yazılarınız yoksa düğmeler her dilde “Beenden”, “Zurück”, “Weiter”, “Fertig” adlarını taşır. Bu nedenle İngilizce veya Lehçe sayfalardaki turlarda her adımın i18n_* alanlarını ayarlarsınız.

“Bana göster”

YZ asistanı yanıtında sayfanızdaki bir kontrole, örneğin “Sepete ekle” düğmesine işaret edebilir. Bunun için widget, sohbet ilk açıldıktan sonra geçerli sayfanın görünür kontrollerini okur.

• Öğe açıkça görünürse halka vurgular; yanında yanıtın ilk cümlesi bulunur. Sohbet penceresi açık kalır.
• Üstü kapalıysa veya ziyaretçi telefondaysa mesajda Bana göster düğmesi görünür. Öğeyi yalnızca tıklama gösterir.
• Herhangi bir dokunma, Escape tuşu veya uzaklaşacak şekilde kaydırma gösterimi bitirir.

Sohbet bunun için kendiliğinden kapanmaz.

Sayfanın okunmasını ve dolayısıyla “Bana göster” özelliğini kodda kapatabilirsiniz:

data-rc-dom-spiegel="false"

Tek tek alanları data-rc-private veya data-rc-ignore ile işaretleyerek hariç tutarsınız. Ayrıntılar Bilgi ve kaynaklar bölümündedir.