كيفية إضافة روبوت الدردشة Asyntai AI إلى CrafterCMS

المنصة:

CrafterCMS

HTML/Custom WordPress Shopify WooCommerce BigCommerce Ecwid Wix Squarespace Webflow Weebly HubSpot Tilda Adobe Experience Manager Duda Google Sites Bludit Plesk Concrete CMS Docusaurus Hugo Kentico Volusion Craft CMS Contentful Strapi Joomla Drupal Magento Blogger Bitrix TYPO3 PrestaShop OpenCart Ghost Statamic Umbraco 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 وانتقل لأسفل إلى قسم "Embed Code". انسخ كود التضمين الفريد الذي سيبدو هكذا:

الخطوة 2: الإضافة إلى قالب FreeMarker (موصى به)

يستخدم CrafterCMS قوالب FreeMarker (.ftl) لعرض الصفحات. أسهل طريقة لإضافة روبوت الدردشة إلى جميع الصفحات هي تحرير قالب الصفحة الرئيسي:

1. في Crafter Studio، انتقل إلى Site Dashboard > Content Types أو انتقل إلى القوالب
2. افتح قالب الصفحة الرئيسي (مثل /templates/web/pages/home.ftl أو التخطيط الأساسي)
3. ابحث عن وسم الإغلاق </body>
4. الصق كود تضمين Asyntai الخاص بك قبل وسم </body> مباشرة:
   <!-- Asyntai AI Chatbot --> <script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script> </body>
5. احفظ الملف وانشر من خلال Crafter Studio

الطريقة البديلة 1: استخدام مكونات قوالب Crafter

لتنظيم أفضل، أنشئ قالب مكون مخصص لأداة روبوت الدردشة:

1. في Crafter Studio، أنشئ ملف قالب جديد في /templates/web/components/asyntai-widget.ftl
2. أضف المحتوى التالي إلى قالب المكون:
   <!-- Asyntai AI Chatbot Component --> <script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>
3. أدرجه في قالب التخطيط الرئيسي باستخدام توجيه تضمين FreeMarker:
   <#include "/templates/web/components/asyntai-widget.ftl" />
4. بدلاً من ذلك، إذا كنت تستخدم نظام عرض المكونات في Crafter، استخدم:
   <@renderComponent component=contentModel.asyntaiWidget />
5. احفظ كلا الملفين وانشر من خلال Crafter Studio

الطريقة البديلة 2: استخدام تكوين الرأس/البرامج النصية في Crafter

يتيح لك CrafterCMS حقن البرامج النصية على مستوى الموقع من خلال تكوين الموقع:

1. في Crafter Studio، انتقل إلى Site Config > Configuration
2. افتح ملف Engine Site Configuration (site-config.xml)
3. أضف تكوين حقن برنامج نصي مخصص:
   <site> <!-- Existing configuration... --> <!-- Custom Scripts --> <scripts> <script> <src>https://asyntai.com/static/js/chat-widget.js</src> <async>true</async> <data-asyntai-id>YOUR_WIDGET_ID</data-asyntai-id> </script> </scripts> </site>
4. بدلاً من ذلك، عدّل تخطيط FreeMarker الأساسي لقراءة تكوين الموقع وحقن البرامج النصية ديناميكياً:
   <#if siteConfig.getString("scripts.script.src", "")?has_content> <script async src="${siteConfig.getString("scripts.script.src")}" data-asyntai-id="${siteConfig.getString("scripts.script.data-asyntai-id")}"></script> </#if>
5. احفظ وانشر تغييرات التكوين

الطريقة البديلة 3: استخدام متحكم Groovy

يدعم CrafterCMS برامج Groovy النصية للمنطق من جانب الخادم. يمكنك استخدام متحكم لإضافة برنامج روبوت الدردشة النصي ديناميكياً:

1. أنشئ برنامج Groovy نصي في /scripts/pages/ (مثل /scripts/pages/home.groovy أو متحكم الموقع العام)
2. أضف الكود التالي لحقن عنوان URL للبرنامج النصي في نموذج القالب:
   // /scripts/pages/home.groovy import org.craftercms.engine.service.context.SiteContext def siteContext = SiteContext.current // Add Asyntai chatbot configuration to the model model.asyntaiEnabled = true model.asyntaiWidgetId = "YOUR_WIDGET_ID" model.asyntaiScriptSrc = "https://asyntai.com/static/js/chat-widget.js"
3. ثم أشر إلى متغيرات النموذج في قالب FreeMarker الخاص بك:
   <#if model.asyntaiEnabled?? && model.asyntaiEnabled> <script async src="${model.asyntaiScriptSrc}" data-asyntai-id="${model.asyntaiWidgetId}"></script> </#if>
4. احفظ كلاً من برنامج Groovy النصي وملف القالب
5. انشر التغييرات من خلال Crafter Studio

الخطوة 3: النشر والتحقق

بعد إجراء التغييرات، انشرها من خلال Crafter Studio:

1. في Crafter Studio، انتقل إلى Site Dashboard
2. راجع التغييرات في قسم My Recent Activity أو Pending Approval
3. انقر على Publish لنشر التغييرات على موقعك المباشر
4. افتح موقعك الإلكتروني في علامة تبويب جديدة أو نافذة تصفح خاص
5. يجب أن ترى زر أداة الدردشة في الزاوية السفلية اليمنى
6. انقر عليه للتأكد من أنه يفتح ويعمل بشكل صحيح