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

دليل خطوة بخطوة لمواقع WordPress

المنصة:

الخطوة 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: اختيار طريقة التثبيت

هناك عدة طرق لإضافة أداة الدردشة إلى WordPress. اختر الطريقة الأنسب لك:

الطريقة 1: استخدام إضافة (موصى به)

أسهل طريقة لإضافة أداة الدردشة هي باستخدام إضافة مثل "Insert Headers and Footers" أو "WPCode".

استخدام WPCode (Free)

انتقل إلى Plugins ← Add New في لوحة إدارة WordPress
ابحث عن "WPCode" وقم بتثبيتها
فعّل الإضافة
انتقل إلى Code Snippets → Header & Footer
الصق كود Asyntai المضمّن في قسم "Footer"
انقر على "Save Changes"

استخدام Insert Headers and Footers

انتقل إلى Plugins ← Add New في لوحة إدارة WordPress
ابحث عن "Insert Headers and Footers" من WPBeginner
قم بتثبيت وتفعيل الإضافة
انتقل إلى الإعدادات → Insert Headers and Footers
الصق كود Asyntai المضمّن في مربع "Scripts in Footer"
انقر على "Save"

لماذا تستخدم إضافة؟ يضمن استخدام إضافة بقاء الكود في مكانه حتى عند تحديث أو تغيير قالب WordPress الخاص بك.

الطريقة 2: تعديل ملفات القالب

يمكنك إضافة الكود مباشرة إلى ملفات القالب. يعتمد موقع محرر ملفات القالب على إصدار WordPress ونوع القالب.

للقوالب الكلاسيكية

انتقل إلى المظهر → محرر ملفات القالب في لوحة إدارة WordPress
حدد القالب النشط من القائمة المنسدلة (إذا لم يكن محددًا بالفعل)
ابحث عن footer.php وانقر عليه في قائمة الملفات على اليمين
انتقل إلى الأسفل وابحث عن وسم الإغلاق </body>
الصق كود تضمين Asyntai الخاص بك قبل وسم </body> مباشرة
انقر على "Update File"

للقوالب الكتلية (قوالب FSE)

إذا كنت تستخدم قالبًا كتليًا (مثل Twenty Twenty-Four أو قوالب تحرير الموقع الكامل الأخرى)، فقد انتقل محرر ملفات القالب:

انتقل إلى الأدوات → محرر ملفات القالب في لوحة إدارة WordPress
حدد القالب النشط من القائمة المنسدلة
ابحث عن footer.php أو footer.html في قائمة الملفات
أضف كود Asyntai المضمّن قبل وسم الإغلاق </body>
انقر على "Update File"

ملاحظة: لا تحتوي بعض القوالب الكتلية على ملف footer.php. في هذه الحالة، استخدم طريقة الإضافة (WPCode) التي تعمل مع جميع أنواع القوالب.

مهم: ستؤدي تحديثات القالب إلى الكتابة فوق تغييراتك. للحصول على حل دائم، استخدم القالب الفرعي أو طريقة الإضافة بدلاً من ذلك.

الطريقة 3: استخدام Elementor

إذا كنت تستخدم Elementor، يمكنك إضافة الكود من خلال ميزة الكود المخصص في Elementor.

Elementor Pro

انتقل إلى Elementor → Custom Code
انقر على "Add New"
أعطه اسمًا مثل "Asyntai Chatbot"
اضبط الموقع على "Before </body> End"
الصق كود تضمين Asyntai
اضبط شروط العرض على "Entire Site"
انقر على "Publish"

Elementor Free

إذا كنت تستخدم الإصدار المجاني من Elementor، استخدم طريقة الإضافة الموضحة أعلاه، حيث يتطلب حقن الكود المخصص Elementor Pro.

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

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

لا ترى الأداة؟ امسح ذاكرة التخزين المؤقت للمتصفح وأي إضافات تخزين مؤقت في WordPress. إذا كنت تستخدم إضافة تخزين مؤقت مثل WP Rocket أو W3 Total Cache، امسح ذاكرة التخزين المؤقت بعد إضافة الكود.

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

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

أضف السمة data-replace إلى وسم السكربت وسيحل الشريط محل الشريط الموجود في قالبك. أضفه باستخدام نفس إضافة الترويسة والتذييل التي استخدمتها لكود المحادثة، مثل Code Snippets أو Insert Headers and Footers. لا يلزم أن يكون السكربت بجوار مربع البحث، لذا لا تحتاج إلى تعديل أي ملف قالب.

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

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

التوثيق