Widget

Widget Kurulumu

OnsraChat widget'ını özelleştirip web sitenize ekleyin.

Temel Kurulum

html
<!-- </body> etiketinden önce ekleyin -->
<script>
  window.OnsraSettings = {
    widgetId: "YOUR_WIDGET_ID"
  };
</script>
<script src="https://widget.onsrachat.com/loader.js" async></script>

Özelleştirme Seçenekleri

javascript
window.OnsraSettings = {
  widgetId: "YOUR_WIDGET_ID",

  // Görünüm
  primaryColor: "#4F46E5",         // Ana renk (hex)
  position: "bottom-right",        // bottom-right | bottom-left | top-right | top-left

  // İçerik
  welcomeMessage: "Merhaba! Size nasıl yardımcı olabilirim?",
  inputPlaceholder: "Mesajınızı yazın...",
  agentName: "Destek Ekibi",
  agentTitle: "Müşteri Hizmetleri",

  // Davranış
  autoOpen: false,                  // Widget otomatik açılsın mı?
  autoOpenDelay: 5000,              // ms cinsinden gecikme
  hideOnMobile: false,              // Mobilde gizle
  showBranding: true,               // "OnsraChat ile güçlendirildi" göster
};

Konum Seçenekleri

bottom-right
bottom-left
top-right
top-left

JavaScript API

Widget'ı JavaScript ile programatik olarak kontrol edebilirsiniz:

javascript
// Widget'ı aç
window.OnsraChat.open();

// Widget'ı kapat
window.OnsraChat.close();

// Widget'ı göster/gizle
window.OnsraChat.toggle();

// Ziyaretçi bilgilerini güncelle (login sonrası)
window.OnsraChat.identify({
  name: "Ahmet Yılmaz",
  email: "ahmet@example.com",
  userId: "user_123",
});

// Özel event gönder
window.OnsraChat.track("purchase_completed", {
  orderId: "ORD-456",
  amount: 299.99,
});

// Widget'ı tamamen kaldır
window.OnsraChat.destroy();

Önizleme

Dashboard'unuzdaki Widget sayfasında yaptığınız değişiklikleri gerçek zamanlı olarak önizleyebilirsiniz.

Widget Sayfasına Git →