كيفية إضافة ووردبريس Ajax Search بدون البرنامج المساعد؟

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

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

ما هو WordPress Ajax Search؟

Ajax search هو نوع من وظائف البحث التي تستخدم تقنية Ajax (Asynchronous JavaScript and XML) لتقديم نتائج بحث في الوقت الفعلي دون الحاجة إلى تحديث الصفحة. يسمح Ajax بإرسال استعلامات البحث إلى الخادم في الخلفية بينما يستمر المستخدم في التفاعل مع الصفحة. يتم بعد ذلك تحميل نتائج البحث ديناميكيًا في الصفحة ، مما يسمح بتجربة مستخدم أكثر سلاسة وسرعة.

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

لماذا يجب عليك إضافة Live Ajax Search إلى موقع WordPress الخاص بك؟

فيما يلي بعض الأسباب الرئيسية التي تجعلك تضيف بحث Ajax المباشر إلى موقع WordPress الخاص بك.

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

كيفية إضافة ووردبريس Ajax Search بدون ملحقات؟

مزايا وعيوب استخدام الكود لإضافة بحث Ajax مباشر إلى موقع WordPress الخاص بك

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

مزايا:

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

سلبيات:

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

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

ما الذي يجب الانتباه إليه عند استخدام الكود لإضافة بحث Ajax إلى موقع WordPress الخاص بك؟

فيما يلي بعض الأشياء التي يجب وضعها في الاعتبار عند إضافة بحث Ajax المباشر إلى موقع WordPress الخاص بك بدون مكون إضافي:

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

تخصيص الكود : تتطلب إضافة وظيفة بحث Ajax بعض معرفة الترميز ، لذا تأكد من امتلاك فهم أساسي لـ HTML و CSS و JavaScript و PHP.

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

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

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

قم يدويًا بإضافة بحث Ajax مباشر إلى موقع WordPress الخاص بك باستخدام التعليمات البرمجية

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

• الخطوة 1: قم بالوصول إلى Theme File Editor

من لوحة معلومات WordPress الخاصة بك ، انتقل إلى المظهر> محرر ملفات السمات

• الخطوة 2: انسخ الكود الرئيسي الذي يعرض بحث Ajax في WordPress

انسخ الكود أدناه. في استعلام آخر ، يمكنك تخصيص HTML الخاص بك كما تريد. سيتفاعل هذا الرمز مع HTML لمساعدتك في إنشاء بحث WP Ajax بدون مكون إضافي.

 } // the ajax function add_action ( 'wp_ajax_data_fetch' , 'data_fetch' ); add_action ( 'wp_ajax_nopriv_data_fetch' , 'data_fetch' ); function data_fetch () { $the_query = new WP_Query ( array ( 'posts_per_page' => - 1 , 's' => esc_attr ( $_POST [ 'keyword' ] ), 'post_type' => array ( 'page' , 'post' ) ) ); if ( $the_query -> have_posts () ) : echo '<ul>' ; while ( $the_query -> have_posts () ): $the_query -> the_post (); ?> <li><a href= "<?php echo esc_url( post_permalink() ); ?>" > <?php the_title (); ?> </a></li> <?php endwhile ; echo '</ul>' ; wp_reset_postdata (); endif ; die (); }

• الخطوة 3: أضف كود بحث Ajax إلى ملف سمة function.php.

في صفحة تحرير الكود ، انتقل إلى function.php من القائمة اليمنى. والصق الكود الذي نسخته في منطقة محرر الكود.

• الخطوة 4: احفظ التغييرات

لا تنس النقر فوق الزر تحديث الملف في الصفحة السفلية.

هذا كل شيء. لقد قدمت بحث Ajax المباشر إلى WordPress بدون مكون إضافي.

سيوفر للزائرين نتائج بحث فورية ويحسن عدد مشاهدات الصفحة.

إذا وجدت الأمر معقدًا وترغب في تجربة طريقة أخرى ، فلنقم بتنزيل سمة Woostify وتثبيتها ونفعل ذلك باستخدام ملحق Woostify's Ajax Product Search.

كيفية إضافة بحث Ajax مباشر إلى موقعك باستخدام ملحق بحث Ajax الخاص بـ Woostify؟

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

كما تعلم ، لتشغيل متجر عبر الإنترنت ، فأنت بحاجة إلى سمة WooCommerce. بدلاً من استخدام سمة WooCommerce WordPress بسيطة دون تعزيز ميزات البيع ، يجب أن تذهب إلى Woostify. يوفر لك Woostify WooCommerce premium theme العديد من الوظائف المفيدة لتشغيل وتطوير موقع التجارة الإلكترونية الخاص بك. يوفر لك Woostify أيضًا إضافة Ajax Product Search التي تجعل عملية إضافة بحث WordPress Ajax أسهل دون تثبيت مكون إضافي خارجي.

قم بتثبيت Woostify Pro الآن

مزايا وعيوب استخدام ملحق Ajax Search الخاص بـ Woostify لإضافة بحث Ajax مباشر إلى موقع WordPress الخاص بك

Ajax Search addon لـ Woostify هو مكون إضافي يضيف وظيفة البحث المدعومة من Ajax إلى متاجر WooCommerce باستخدام سمة Woostify. يستخدم المكون الإضافي تقنية Ajax لتقديم نتائج بحث في الوقت الفعلي دون الحاجة إلى تحديث الصفحة ، مما يجعله أسرع وأكثر كفاءة للمستخدمين للعثور على المنتجات التي يبحثون عنها.

تم تصميم ملحق Ajax Search للعمل بسلاسة مع سمة Woostify ومكوِّن WooCommerce الإضافي ، مما يوفر ميزات بحث متقدمة مثل عرض صورة المنتج والاقتراحات التلقائية والقدرة على البحث حسب رمز SKU للمنتج أو الفئة أو العلامة. يتضمن الملحق أيضًا خيارات لتخصيص تخطيط شريط البحث والألوان والخطوط لتتناسب مع تصميم موقعك.

يمكن أن يؤدي استخدام الملحق Ajax Search إلى تحسين وظيفة البحث في متجر WooCommerce ، وتحسين تجربة المستخدم وزيادة المبيعات عن طريق تسهيل العثور على المنتجات وشرائها على العملاء. يتوفر الملحق كجزء من حزمة Woostify Pro ، والتي تتضمن ميزات ودعمًا إضافيًا متميزًا.

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

عملية مفصلة لإضافة بحث Ajax مباشر إلى موقع WordPress الخاص بك باستخدام الملحق Woostify's Ajax Search

هذه هي أبسط طريقة لإضافة بحث Ajax المباشر إلى موقع WordPress الخاص بك ، خاصة لمواقع WooCommerce.

لتنفيذ بحث WordPress Ajax على مواقع WooCommerce باستخدام ملحق Ajax Search الخاص بـ Woostify ، يجب عليك اتباع الخطوات أدناه.

• الخطوة 1: تفعيل الملحق Woostify's Ajax Search

افترض أنك قمت بتثبيت Woostify theme pro على موقع WooCommerce الخاص بك. لذا فإن الخطوة الأولى هي تمكين الملحق Ajax Product Search الخاص بـ Woostify. من لوحة معلومات WordPress الخاصة بك ، انتقل إلى Woostify .

بعد ذلك ، انتقل إلى علامة التبويب الوظائف الإضافية من القائمة العلوية. بعد ذلك ، سترى جدول الوظائف الإضافية المميزة لـ Woostify هناك.

حرك الماوس للعثور على الملحق Ajax Product Search وقم بتشغيل زر تمكين للضوء الأخضر كما هو موضح أدناه.

• الخطوة 2: قم بإعداد بحث Ajax على موقع WooCommerce الخاص بك.

للوصول إلى صفحة الإعداد الخاصة بالملحق Ajax Product Search ، يجب أن تضغط على أيقونة الإعداد في زاوية المربع على النحو التالي:

الآن بعد أن وصلت إلى صفحة الإعداد ، يمكنك إعداد الملحق Ajax Product Search.

كما ترى ، في هذا القسم ، يمكنك ضبط الإعدادات بالعناصر التالية.

- عامل تصفية : حدد هذا الخيار إذا كنت تريد عرض مرشح فئة.

- فئة البحث : حدد هذا الخيار إذا كنت ترغب في إظهار البحث في الفئات.

- علامة البحث : حدد هذا المربع إذا كنت ستظهر البحث في العلامات.

- سمات البحث : حدد هذا المربع إذا كنت ترغب في إظهار البحث في سمات المنتج.

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

- المنتجات غير المتوفرة بالمخزون : حدد هذا الخيار إذا كنت تريد إزالة المنتجات غير المتوفرة بالمخزون في نتائج البحث.

- نتيجة التحديد : أدخل "-1" لإظهار جميع نتائج البحث

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

- تمييز اللون : يمكنك تخصيص لون النص في نتائج البحث.

- بيانات الفهرس : حدد هذا المربع للاحتفاظ بـ Ajax Search Addon لفهرسة جميع البيانات في موقع WooCommerce الخاص بك.

- آخر تحديث : يعرض هذا آخر تحديثات الإعدادات.

- فهرس المنتج الإجمالي : يوضح العدد الإجمالي للمنتجات المفهرسة.

• الخطوة 3: الحفظ والمعاينة

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

الكلمات الأخيرة،

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

بدلاً من ذلك ، إذا لم تكن مرتاحًا للتشفير ، فيمكنك اختيار سمة Woostify premium لتصميم موقعك ، وخاصة موقع التجارة الإلكترونية. باستخدام ملحق Ajax Product Search الإضافي لـ Woostify ، يمكنك جعل عملية إضافة بحث Ajax المباشر أبسط بكثير ولكن تحقق نتائج أفضل بجهد أقل.

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