איך להוסיף צ'אטבוט AI של Asyntai ל-Craft CMS

פלטפורמה:

Craft CMS

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: קבל את קוד ההטמעה שלך

First, go to your Asyntai Dashboard and scroll down to the "Embed Code" section. Copy your unique embed code which will look like this:

שלב 2: עריכת תבנית הפריסה שלך (מומלץ)

הדרך הקלה ביותר להוסיף את הצ'אטבוט לכל העמודים היא על ידי עריכת תבנית הפריסה הראשית שלך:

1. גש לקבצי פרויקט Craft CMS שלך דרך FTP, SSH או עורך הקוד שלך
2. נווט לתיקיית templates/
3. מצא את קובץ הפריסה הראשי שלך (בדרך כלל נקרא _layout.twig, _layout.html, או נמצא ב-templates/_layouts/)
4. מצא את תג הסגירה </body>
5. הדבק את קוד ההטמעה של Asyntai ממש לפני תג </body>
6. שמור את הקובץ

Alternative: Using Twig {% js %} Tag (Craft CMS 3.x+)

Craft CMS מספק תגית Twig מובנית לרישום JavaScript:

1. פתח את תבנית הפריסה הראשית שלך
2. הוסף את הקוד הבא לפני תגית הסגירה </body>:
   {% js %} (function() { var script = document.createElement('script'); script.async = true; script.src = 'https://asyntai.com/static/js/chat-widget.js'; script.setAttribute('data-asyntai-id', 'YOUR_WIDGET_ID'); document.body.appendChild(script); })(); {% endjs %}
3. החלף את YOUR_WIDGET_ID במזהה הווידג'ט האמיתי שלך
4. שמור את הקובץ

חלופה: יצירת קובץ include נפרד

לארגון טוב יותר, צור קובץ include ייעודי:

1. צור קובץ חדש: templates/_includes/chatbot.twig (או .html)
2. הוסף את קוד ההטמעה של 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>
3. בתבנית הפריסה הראשית שלך, כלול קובץ זה לפני </body>:
   {% include '_includes/chatbot' %}
4. שמור את שני הקבצים

חלופה: טעינה מותנית

לטעינת הצ'אטבוט רק בעמודים או בחלקים ספציפיים:

1. בתבנית הפריסה או העמוד שלך, השתמש בתנאי Twig:
   {% if entry.showChatbot ?? true %} <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> {% endif %}
2. או בדוק עבור חלקים ספציפיים:
   {% if craft.app.request.segments[0] != 'admin' %} <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> {% endif %}

שלב 3: אמת את ההתקנה

לאחר שמירת השינויים שלך, בקר באתר Craft CMS שלך בכרטיסיית דפדפן חדשה או בחלון גלישה פרטית. אתה אמור לראות את כפתור הצ'אט בפינה הימנית התחתונה. לחץ עליו כדי לוודא שהוא נפתח ופועל כראוי.