Başlamadan önce
Yerleştirme kodunuzu Panel → Widget → Kurulum ve güvenlik ekranından kopyalayın. Kodda size özel site anahtarı hazır olarak bulunur ve şöyle görünür:
<script src="https://api.apexbot.eu/widget.js" data-site-key="apex_pk_…" async></script>Webflow, özel kodu yalnızca ücretli site planı olan sitelerde çalıştırır.
Tüm sayfalara ekleyin
- Projenizin Site settings ekranını açın ve Custom code sekmesine gidin.
- Yerleştirme kodunu Footer code kutusuna (
</body>etiketinden önceki kod için olan kutu) yapıştırın. - Save changes düğmesine tıklayın, ardından sitenizi yayınlayın. Özel kod Designer'da değil, yalnızca yayındaki sitede çalışır.
Ya da tek bir sayfaya
Sohbeti yalnızca bir sayfada göstermek için Designer'da o sayfanın ayarlarını açın, kodu Custom code → Before </body> tag alanına yapıştırın ve yayınlayın. Birkaç sayfa dışında her yerde göstermek için kodu site geneline ekleyin ve istisnaları Apex panelinizde Davranış → Bu sayfalarda gizle altında listeleyin.
Alan adlarınıza izin verin
İzinli web siteleri altına www olan ve olmayan özel alan adınızı ekleyin. Önce Webflow'un test adresinde denemek için https://siteniz.webflow.io adresini de ekleyin. Widget yalnızca listelenen adreslerde çalışır.
Bilmeniz gerekenler
- Bilgi tabanı. Yayındaki sitenizi bilgi kaynağı olarak ekleyin. Apex site haritanızı ve CMS koleksiyon sayfaları dahil bağlantılı sayfaları sayfa sınırınıza kadar okur. Büyük değişiklikleri yayınladıktan sonra yeniden senkronize edin.
- Stil. Widget bir Shadow DOM içinde çizilir; Webflow stilleriniz onu bozamaz. Renkler, sohbet düğmesi ve konum Apex panelinden ayarlanır.
- Bir düğmeden açmak. Bir düğmeye kimlik verin (örneğin
help) ve yerleştirme kodundan sonra<script>document.getElementById("help").onclick = () => Apex.open()</script>ekleyin. Bkz. JavaScript API.
Sohbet düğmesi görünmüyorsa sorun giderme bölümüne bakın.