دليل

كيفية إضافة أداة دردشة واتساب إلى WordPress (بدون إضافة)

Abhishek Sachan
#أداة دردشة واتساب لـ WordPress#أداة واتساب لـ WordPress#بدون إضافة#The Chat Quotient

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

لوحة تحكم WordPress تعرض كتلة HTML مخصصة تحتوي على كود أداة واتساب بجانب معاينة مباشرة للموقع

ابحث عن “أداة دردشة واتساب WordPress” وستجد أن معظم النتائج توجهك إلى إضافة: تثبّتها، تفعّلها، تضبط إعداداتها في شاشة خاصة بها، وتصبح الآن شيئاً إضافياً على موقعك يحتاج إلى تحديث في كل مرة يتغير فيها نواة WordPress أو القالب. هناك طريقة أسرع تتخطى الإضافة كلياً. أداة واتساب هي زر عائم، والزر العائم هو بضعة أسطر من HTML بالإضافة إلى علامة script، وكلاهما لدى WordPress بالفعل مكان للصقهما دون إضافة أي شيء إلى صفحة الإضافات لديك.

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

لماذا تتخطى الإضافة

إضافة واتساب لـ WordPress ليست وهمية ولا معطلة، فهي تضيف فعلاً زراً عائماً تماماً كما يفعل أسلوب المقطع البرمجي. الفرق يكمن فيما تكلفه المحافظة عليها. كل إضافة على موقع WordPress هي كود يعمل مع كل تحميل صفحة، ويحتاج تحديثاته الخاصة عند تغيّر إصدارات WordPress أو PHP، وهو عنصر إضافي يُبلّغ عنه أي فاحص أمني إذا تُرك دون تحديث. الموقع الذي يحتوي على منشئ صفحات، وإضافة SEO، وإضافة تخزين مؤقت، وإضافة نماذج، والآن إضافة واتساب، بات لديه خمسة عناصر منفصلة يمكن أن تتعارض مع بعضها، وإضافات أدوات واتساب تحديداً تميل إلى تحميل ملفات CSS وJavaScript خاصة بها على كل صفحة، سواء نقر الزائر على الزر أم لا.

المقطع البرمجي الملصق لا يملك شاشة إعدادات، ولا سجل تغييرات، ولا إشعار توافق. إنه كتلة ثابتة في تذييل القالب أو كتلة HTML مخصصة في صفحة، ويتعامل معه WordPress تماماً كأي محتوى مضمّن آخر. لا شيء يحتاج إلى تفعيل، ولا شيء يحتاج إلى تحديث مستمر.

مع ذلك، الإضافة ليست الخيار الخاطئ لكل موقع. إذا لم تكن مرتاحاً للصق كود في أي مكان، أو أردت أن تكون إعدادات الأداة قابلة للتغيير من wp-admin بواسطة شخص لا ينبغي أن يقترب من المظهر → محرر ملفات القالب، فإن واجهة إعدادات الإضافة هي الخيار الأكثر أماناً. مسار المقطع البرمجي يفترض أنك مرتاح بنسخ ولصق كتلة كود واحدة مرة واحدة، والعودة إليها فقط عندما تريد فعلاً تغيير شيء ما.

الحصول على المقطع البرمجي

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

<script src="https://cdn.thechatquotient.com/widget/v1/widget.js"
  data-widget-id="wgt_xxxxxxxx"
  data-whatsapp-number="15551234567"
  data-color="#25D366"
  data-position-vertical="bottom"
  data-position-horizontal="right"
  data-offset-vertical="20"
  data-offset-horizontal="20"
  data-z-index="5000"
  data-greeting="Hi! How can we help?"
  async
  defer
></script>

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

الطريقة الأولى: كتلة HTML مخصصة

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

معظم القوالب التي تدعم تحرير الموقع الكامل تتيح لك إضافة كتلة HTML مخصصة إلى قالب التذييل نفسه:

  1. اذهب إلى المظهر → المحرر (أو المظهر → محرر القالب على الإعدادات القديمة).
  2. افتح جزء قالب التذييل (Footer).
  3. أضف كتلة HTML مخصصة في أي مكان داخله.
  4. الصق علامة script واحفظ.

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

الطريقة الثانية: ملف footer.php للقالب عبر محرر ملفات القالب

القوالب الكلاسيكية (غير المبنية على الكتل) لا تملك جزء قالب تذييل يمكن تعديله بصرياً، لذا يذهب المقطع البرمجي مباشرة إلى ملف PHP الخاص بالقالب بدلاً من ذلك:

  1. اذهب إلى المظهر → محرر ملفات القالب.
  2. في قائمة الملفات، افتح footer.php.
  3. ابحث عن علامة الإغلاق </body>، وتكون عادة قرب نهاية الملف.
  4. الصق علامة script في سطر مستقل، مباشرة قبل </body>.
  5. انقر على تحديث الملف.

هذه هي الطريقة الوحيدة التي تلمس كود القالب مباشرة، لذا تأتي مع التحذير الحقيقي الوحيد لأسلوب المقطع البرمجي: تحديث القالب قد يستبدل footer.php بالكامل ويحذف اللصقة دون أي تنبيه. إذا كان قالبك يدعم قالباً فرعياً، فقم بهذا التعديل في ملف footer.php الخاص بالقالب الفرعي بدلاً من ذلك، لأن ملفات القالب الفرعي تبقى سليمة عبر تحديثات القالب الأساسي. وإذا لم تكن تستخدم قالباً فرعياً ولا تريد إعداد واحد، فإن إضافة مثل Insert Headers and Footers (إضافة أحادية الغرض، منخفضة الصيانة، وليست إضافة أداة واتساب كاملة) تمنحك حقل تذييل مخصص غير مرتبط بملفات القالب على الإطلاق، ويبقى سليماً تلقائياً مع كل تحديث للقالب.

الطريقة الثالثة: أداة كود التضمين في Elementor أو Divi

إذا كان الموقع مبنياً بمنشئ صفحات، عادة ما توجد أداة مصممة تحديداً لهذا الغرض:

كلا المنشئين يعرضان كود HTML الخام وعلامة script كما هما، دون أي تنقية تحذف علامة <script> كما تفعل بعض مناطق المحتوى ذات التحرير المرئي المباشر (WYSIWYG)، لذلك تُحمَّل الأداة وتعمل بنفس الطريقة تماماً كما لو تم لصقها مباشرة في footer.php.

التأكد من أن الأمر يعمل

مهما كانت الطريقة التي لصقت بها الكود، افتح الموقع في نافذة تصفح متخفٍ حتى لا تعرض لك صفحة مخزنة مؤقتاً نسخة قديمة، وتحقق من كل قالب من المفترض أن تظهر عليه الأداة: الصفحة الرئيسية، مقالة مدونة، وأي صفحة هبوط مبنية بقالب مختلف عن باقي الموقع، لأن تعديل التذييل في ملف قالب واحد أو قالب منشئ صفحات لا يغطي تلقائياً صفحة هبوط تستخدم قالباً منفصلاً. انقر على الزر من سطح المكتب ومن هاتف فعلي أيضاً. على الهاتف المحمول مع تثبيت واتساب، يجب أن يفتح التطبيق مباشرة مع رقمك ورسالة الترحيب مملوءين مسبقاً؛ على سطح المكتب، يفتح web.whatsapp.com في علامة تبويب جديدة.

متى تكون الإضافة فعلاً الخيار الأنسب

هناك بضعة مواقف تُرجّح الكفة مجدداً نحو تثبيت إضافة مخصصة:

إذا كان عدة أشخاص غير تقنيين يديرون الموقع ولا ينبغي لأي منهم الاقتراب من محرر ملفات القالب، فإن شاشة إعدادات الإضافة أكثر أماناً من الوثوق بأن الجميع سيتركون footer.php دون لمسه. وإذا أردت أن تظهر الأداة أو تختفي حسب الصفحة أو نوع المقالة عبر مربع اختيار في الشريط الجانبي للمحرر بدلاً من تعديل ملف قالب، فهذا المنطق الخاص بكل صفحة هو تحديداً ما يتعامل معه كود PHP الخاص بالإضافة ولا يستطيع المقطع البرمجي الثابت فعله. وإذا كنت تستخدم بالفعل تكاملاً كاملاً مع WhatsApp Business API عبر إضافة تتولى أيضاً الأداة كجزء واحد من مجموعة ميزات أكبر، فإن استبدال جزء الأداة فقط بمقطع برمجي منفصل يضيف شيئاً ثانياً يجب صيانته بدلاً من إزالة شيء واحد.

بالنسبة للحالة الشائعة، رقم واتساب واحد، زر واحد، ونفس السلوك على كل صفحة، يؤدي المقطع البرمجي المهمة نفسها دون أن يتبقى أي شيء لتحديثه لاحقاً.

الأسئلة الشائعة

هل سيؤدي هذا إلى إبطاء موقع WordPress لدي؟ تستخدم علامة script الخاصيتين async وdefer، لذلك تُحمَّل دون حجب بقية الصفحة، وهي طلب خارجي واحد بدلاً من عدة ملفات أنماط وسكريبتات منفصلة قد تحمّلها إضافة كاملة.

هل يعمل هذا مع إضافات التخزين المؤقت مثل WP Rocket أو W3 Total Cache؟ نعم. بما أنها علامة script ثابتة، وليست شيئاً يُعرض عبر PHP مع كل طلب، فإن التخزين المؤقت للصفحات لا يتعارض معها، على عكس بعض الأدوات القائمة على الإضافات التي تُحذف أحياناً بسبب إعدادات تصغير HTML العدوانية.

هل يمكنني استخدام هذا مع WooCommerce؟ نعم، الوضع مطابق تماماً: footer.php، أو جزء قالب التذييل، أو قالب تذييل منشئ الصفحات، ولا يهم أياً منها ما إذا كان الموقع يشغّل WooCommerce أيضاً.

ماذا لو لم يكن محرر ملفات القالب متوفراً في قالبي؟ بعض مزودي الاستضافة يعطلونه لأسباب أمنية. في هذه الحالة، استخدم كتلة HTML مخصصة في جزء قالب التذييل إذا كان قالبك يدعم تحرير الموقع الكامل، أو أداة التضمين الخاصة بمنشئ الصفحات لديك إن وُجدت، أو إضافة صغيرة أحادية الغرض مثل Insert Headers and Footers كخيار بديل لا يتطلب لمس ملفات القالب على الإطلاق.

هل أحتاج إلى إعادة تثبيت المقطع البرمجي إذا غيّرت قالب WordPress؟ نعم، لأنه كان ملصقاً في footer.php أو جزء القالب الخاص بالقالب القديم. انسخ نفس المقطع البرمجي مرة أخرى من الأداة (معرف الأداة لديك يبقى كما هو) والصقه في القالب الجديد باستخدام أياً من الطرق الثلاث المناسبة له.

الخلاصة

أداة واتساب هي علامة script واحدة، ولدى WordPress بالفعل ثلاثة أماكن مبنية لتحتوي عليها تحديداً: كتلة HTML مخصصة في قالب التذييل، أو footer.php عبر محرر ملفات القالب، أو أداة كود التضمين في منشئ الصفحات لديك. لا شيء من هذه الطرق يتطلب تثبيت إضافة مخصصة لهذه المهمة. احصل على المقطع البرمجي من منشئ أداة دردشة واتساب، الصقه في أي من الطرق الثلاث المناسبة لطريقة بناء موقعك، وستصبح الأداة نشطة على الفور، دون أي شيء جديد يجب تحديثه في المرة القادمة التي يُصدر فيها WordPress إصداراً جديداً.

← العودة للمدونة

Your Next Customer Is Messaging You Right Now.

أضف إضافة Chrome وغيّر طريقة إدارتك لمحادثات واتساب لأعمالك.

5.0 rating on the Chrome Web Store · 500+ small businesses already on board