Rehberlere Dön
Başlarken5 min

Web Sitenize Yerleştirme

Basit bir kod parçacığıyla chatbotunuzu herhangi bir web sitesine ekleyin. WordPress, Shopify, React ve herhangi bir HTML sayfasıyla çalışır.

Neler öğreneceksiniz

  • Yerleştirmeyi etkinleştirin
  • İzin verilen kaynakları ekleyin
  • Yerleştirme kodunu kopyalayın
  • Web sitenize ekleyin
  • Çalıştığını doğrulayın
1

Yerleştirmeyi etkinleştirin

Chatbot ayarlarınızda 'Yayınla' bölümüne gidin. Chatbotunuzun harici web sitelerinde görünmesine izin vermek için 'Yerleştirmeyi Etkinleştir' seçeneğini açın.

Embed Status

Enable Embedding

Allow your chatbot on external websites

Embedding is enabled. Your chatbot can now be added to external websites.

2

İzin verilen kaynakları ekleyin

Güvenlik için, chatbotunuzu hangi alan adlarının yerleştirebileceğini belirtin. Web sitenizin URL'sini ekleyin (örn. https://siteniz.com). Alt alan adları için joker karakterler kullanın (örn. *.siteniz.com, blog.siteniz.com, shop.siteniz.com vb. için izin verir).

Allowed Origins

Specify which domains can embed your chatbot

https://example.com
https://acme.com
*.acme.com

Tip: Use *.domain.com to allow all subdomains

💡İpucu

  • Hazırlık ve üretim gibi farklı ortamlar için birden fazla kaynak ekleyebilirsiniz.
3

Yerleştirme kodunu kopyalayın

Yerleştirme etkinleştirildiğinde, bir kod parçacığı göreceksiniz. Panoya kopyalamak için kopyala düğmesine tıklayın. Kod, chatbot widget'ınızı yükleyen küçük bir JavaScript parçacığıdır.

Embed Code

Copy this code and paste it into your website

<script
  src="https://chattlebot.com/embed.js"
  data-chatbot-id="abc123"
  async
></script>
Click to copy to clipboard
4

Web sitenize ekleyin

Yerleştirme kodunu web sitenizin HTML'ine, kapanış </body> etiketinden hemen önce yapıştırın. Bu, chatbotun sayfa içeriğinizden sonra yüklenmesini sağlar. Sohbet balonu web sitenizin köşesinde görünecektir.

Add to Your Website

Paste the embed code just before the closing </body> tag

index.html
<!DOCTYPE html>
<html>
<head>
  <title>My Website</title>
</head>
<body>
  <!-- Your content -->

  <!-- Chattlebot Widget -->
  <script
    src="https://chattlebot.com/embed.js"
    data-chatbot-id="abc123"
    async
  ></script>
</body>
</html>

Works everywhere: WordPress, Shopify, Webflow, Next.js, React, or any HTML website.

💡İpucu

  • WordPress için kodu eklemek üzere 'Insert Headers and Footers' gibi bir eklenti kullanın. Shopify için theme.liquid dosyanıza ekleyin.
5

Çalıştığını doğrulayın

Web sitenizi ziyaret edin ve sohbet balonunu arayın. Chatbotu açmak için tıklayın ve her şeyin doğru çalıştığını test edin. Balon görünmüyorsa, alan adınızın izin verilen kaynaklar listesinde olduğundan emin olun.

Başlamaya hazır mısınız?

Ücretsiz hesabınızı oluşturun ve bugün chatbotunuzu oluşturmaya başlayın.

Ücretsiz Denemeye Başla