Как да добавите AI чатбот на Asyntai в WooCommerce

Платформа:

WooCommerce

HTML/Custom WordPress Shopify WooCommerce BigCommerce Ecwid Wix Squarespace Webflow Weebly HubSpot Tilda Adobe Experience Manager Duda Google Sites Bludit Plesk Concrete CMS Craft CMS Contentful Docusaurus Strapi Joomla Kentico Drupal Magento Blogger Bitrix TYPO3 PrestaShop OpenCart Ghost Hugo Statamic Umbraco Volusion Moodle SilverStripe Grav October CMS ProcessWire Sanity ExpressionEngine Sylius Backdrop CMS MODX Bagisto PayloadCMS e107 CrafterCMS Kirby MedusaCMS DatoCMS GoDaddy Framer Bubble Carrd Jimdo Strikingly Kajabi Teachable Thinkific ClickFunnels Hostinger Unbounce Leadpages Systeme.io Instapage

Стъпка 1: Вземете вашия код за вграждане

Първо отидете на вашето Табло за управление на Asyntai и превъртете надолу до секцията "Код за вграждане". Копирайте уникалния си код за вграждане, който ще изглежда така:

Стъпка 2: Използване на добавка (Препоръчително)

Най-лесният начин да добавите чатбота към вашия WooCommerce магазин е с безплатна добавка за header/footer:

1. Влезте в своя WordPress административен панел
2. Отидете на Plugins → Add New
3. Потърсете "Insert Headers and Footers" от WPCode (или подобна добавка)
4. Кликнете "Install Now" и след това "Activate"
5. Отидете на Code Snippets → Header & Footer (или страницата с настройки на добавката)
6. Поставете вашия Asyntai код за вграждане в секцията "Footer"
7. Кликнете "Save Changes"

Алтернатива: Използване на персонализатора на темата

Много теми за WooCommerce имат вградени опции за добавяне на персонализирани скриптове:

1. Отидете на Appearance → Customize
2. Потърсете секция с име "Additional CSS/JS", "Custom Code" или "Footer Scripts"
3. Поставете вашия Asyntai код за вграждане в подходящото поле
4. Кликнете "Publish", за да запазите промените

Алтернатива: Редактиране на файловете на темата (functions.php)

За разработчици или тези, които се чувстват комфортно да редактират файлове на темата:

1. Отидете на Appearance → Theme File Editor
2. Изберете вашата активна тема (или за предпочитане дъщерната тема)
3. Отворете файла functions.php
4. Добавете следния код в края на файла:
   function add_asyntai_chatbot() {
  echo '<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>';
}
add_action('wp_footer', 'add_asyntai_chatbot');
5. Заменете YOUR_WIDGET_ID с вашия действителен ID на уиджета
6. Кликнете "Update File"

Алтернатива: Специфична за WooCommerce кука

За да заредите чатбота само на WooCommerce страници (магазин, продукт, количка, плащане):

1. Добавете този код към файла functions.php на вашата тема:
   function add_asyntai_chatbot_woocommerce() {
  if (is_woocommerce() || is_cart() || is_checkout() || is_account_page()) {
    echo '<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>';
  }
}
add_action('wp_footer', 'add_asyntai_chatbot_woocommerce');
2. Заменете YOUR_WIDGET_ID с вашия действителен ID на уиджета
3. Запазете файла

Стъпка 3: Проверка на инсталацията

След запазване на промените посетете вашия WooCommerce магазин в нов раздел на браузъра или в инкогнито режим. Трябва да видите бутона на чат джаджата в долния десен ъгъл. Кликнете върху него, за да се уверите, че се отваря и работи правилно.