How to Add Asyntai AI Chatbot to Tiendanube

Step-by-step guide for Tiendanube and Nuvemshop stores

แพลตฟอร์ม:

ขั้นตอนที่ 1: รับโค้ดฝังตัวของคุณ

ขั้นแรก ไปที่ แดชบอร์ด Asyntai ของคุณ แล้วเลื่อนลงไปที่ส่วน "โค้ดฝัง" คัดลอกโค้ดฝังเฉพาะของคุณ ซึ่งจะมีลักษณะดังนี้:

<script>(function(){var l=function(){var s=document.createElement("script");s.src="https://widget.asyntai.com/static/js/chat-widget.js";s.async=true;s.setAttribute("data-asyntai-id","YOUR_WIDGET_ID");document.head.appendChild(s)};if(document.readyState==="complete"){l()}else{window.addEventListener("load",l)}})();</script>

หมายเหตุ: โค้ดด้านบนเป็นเพียงตัวอย่าง คุณต้องคัดลอกโค้ดฝังตัวเฉพาะของคุณจากแดชบอร์ดเนื่องจากมี widget ID ส่วนตัวของคุณ

Method 1: External Codes (Recommended, No Coding)

The easiest way to add Asyntai to every page of your store is through the built-in External Codes section. This is called Códigos externos in Tiendanube (Spanish stores) and Códigos externos in Nuvemshop (Brazilian stores). No theme editing is required.

Log in to your Tiendanube (or Nuvemshop) admin panel.
In the left-hand menu, go to Settings → External Codes (Configuración → Códigos externos in Tiendanube, or Configurações → Códigos externos in Nuvemshop).
Scroll down to the Other conversion codes field (labeled Otros códigos de conversión in Tiendanube, or Códigos de conversão / Códigos de rastreamento in Nuvemshop). This is a free text box that accepts custom HTML and JavaScript.
Paste your Asyntai embed code into this field:

<script>(function(){var l=function(){var s=document.createElement("script");s.src="https://widget.asyntai.com/static/js/chat-widget.js";s.async=true;s.setAttribute("data-asyntai-id","YOUR_WIDGET_ID");document.head.appendChild(s)};if(document.readyState==="complete"){l()}else{window.addEventListener("load",l)}})();</script>

Click Save changes (Guardar cambios / Salvar alterações) at the bottom of the page.
The code is now loaded on your entire storefront automatically.

เคล็ดลับ: The External Codes section injects your script on every storefront page, so the chat widget appears across your whole store with a single paste. This is the recommended method for most merchants because it survives theme updates and requires no code editing.

หมายเหตุ: The External Codes page also has dedicated fields for Google Analytics, Google Ads, and the Facebook Pixel. Do not paste the Asyntai code into those specific fields — use the general "Other conversion codes" text box instead.

Method 2: Edit Your Theme Code

If you prefer to place the code directly in your theme (for example, to control exactly where it loads), you can edit your store's design code:

In your admin panel, go to Online Store → Design (Tienda online → Diseño in Tiendanube, or Loja online → Design in Nuvemshop).
Find your active theme and click Edit code (Editar el código / Editar o código). This opens the theme's HTML, CSS, and JavaScript files via the code editor / FTP.
Open the main layout file (for example layout.tpl or header.tpl).
Locate the closing </body> tag near the bottom of the file.
Paste your Asyntai embed code just before the </body> tag:

<script>(function(){var l=function(){var s=document.createElement("script");s.src="https://widget.asyntai.com/static/js/chat-widget.js";s.async=true;s.setAttribute("data-asyntai-id","YOUR_WIDGET_ID");document.head.appendChild(s)};if(document.readyState==="complete"){l()}else{window.addEventListener("load",l)}})();</script>
</body>

Save the file. Changes are published to your live store.

สำคัญ: Before editing theme files, make a copy of the file you are changing (or note the original code) so you can revert if needed. Placing the code inside the shared layout file ensures the widget loads on every page of your store.

เคล็ดลับ: You can also upload a JavaScript file into your theme's Static folder and reference it with Tiendanube's static_url helper. For most users, however, the single embed script above is all you need.

ขั้นตอนที่ 2: ตรวจสอบการติดตั้ง

After saving your changes, open your Tiendanube or Nuvemshop store in a new browser tab or incognito window. You should see the chat widget button in the bottom right corner. Click it to ensure it opens and functions correctly.

ไม่เห็นวิดเจ็ต? Make sure you clicked Save changes. Clear your browser cache or view in incognito mode, since your store may cache pages for a few minutes. Check the browser console (F12) for any JavaScript errors, and confirm you pasted your own widget ID from the Dashboard.

ต้องการความช่วยเหลือ?

If you're not comfortable editing code, the External Codes method above requires no technical skills at all. You can also contact Asyntai support for guidance on installing the chatbot on your Tiendanube or Nuvemshop store.