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

دليل خطوة بخطوة لمتاجر Shopify

المنصة:

الخطوة 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:

<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>

ملاحظة: الكود أعلاه مجرد مثال. يجب عليك نسخ كود التضمين الفريد الخاص بك من لوحة التحكم لأنه يحتوي على معرف الأداة الشخصي الخاص بك.

الخطوة 2: إضافة الكود إلى قالب Shopify الخاص بك

اتبع هذه الخطوات لإضافة روبوت الدردشة إلى متجر Shopify الخاص بك:

سجّل الدخول إلى لوحة إدارة Shopify
انتقل إلى Online Store → Themes
ابحث عن قالبك الحالي وانقر على زر "..." (النقاط الثلاث)
اختر "Edit code" من القائمة المنسدلة
في الشريط الجانبي الأيسر، تحت Layout، انقر على theme.liquid
مرر لأسفل للعثور على وسم الإغلاق </body>
الصق كود تضمين Asyntai الخاص بك قبل وسم </body> مباشرة
انقر على "Save" في الزاوية العلوية اليمنى

نصيحة: استخدم Ctrl+F (Windows) أو Cmd+F (Mac) للبحث السريع عن </body> في ملف theme.liquid.

بديل: استخدام تطبيق Shopify

إذا كنت تفضل عدم تعديل الكود، يمكنك استخدام تطبيق Shopify لإضافة أكواد مخصصة:

انتقل إلى متجر تطبيقات Shopify
ابحث عن "Custom Script Injector" أو "Header & Footer Scripts"
ثبّت التطبيق الذي تختاره
استخدم التطبيق لإضافة كود تضمين Asyntai إلى قسم التذييل

الخطوة 3: التحقق من التثبيت

بعد حفظ التغييرات، قم بزيارة متجر Shopify الخاص بك في علامة تبويب جديدة أو نافذة تصفح خاص. يجب أن ترى زر أداة الدردشة في الزاوية السفلية اليمنى من متجرك. انقر عليه للتأكد من أنه يفتح ويعمل بشكل صحيح.

لا ترى الأداة؟ قد يقوم Shopify بتخزين ملفات القالب مؤقتاً. جرب فتح متجرك في نافذة تصفح خاص، أو انتظر بضع دقائق وقم بتحديث الصفحة.

مستخدمو Shopify Plus

إذا كنت على خطة Shopify Plus، يمكنك أيضاً إضافة الكود عبر ملف checkout.liquid لعرض روبوت الدردشة في صفحات الدفع. ومع ذلك، لاحظ أن معظم المتاجر تحتاجه فقط في صفحات الواجهة الرئيسية.

إضافة شريط البحث بالذكاء الاصطناعي

شريط البحث بالذكاء الاصطناعي مكوّن منفصل له كوده الخاص. أضفه إلى جانب المحادثة، أو بمفرده. يتطلب باقة Standard أو أعلى: في الباقات الأدنى يظهر الشريط لكنه لا يعرض نتائج.

أضف السمة data-replace إلى وسم السكربت وسيحل الشريط محل الشريط الموجود في قالبك. الصقه في theme.liquid قبل وسم body الختامي مباشرة، وهو نفس الملف الذي يحتوي على كود المحادثة. يحتفظ قالبك بصفحة نتائج البحث الخاصة به، لذا يظل الضغط على Enter يعمل تماماً كما كان.

<script src="https://widget.asyntai.com/static/js/search-widget.js" data-asyntai-id="YOUR_WIDGET_ID" data-replace="auto" async></script>

اقرأ دليل شريط البحث بالذكاء الاصطناعي كاملاً