كيفية إضافة Live Ajax Search إلى WordPress الخاص بك بدون البرنامج المساعد

نشرت: 2022-08-01

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

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

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

فيما يلي جدول محتويات لمساعدتك على التنقل:

  • لماذا تضيف Live Search إلى موقعك
  • عيوب إضافة Live Ajax Search بدون إضافة
  • أسهل طريقة لإضافة Live Ajax Search إلى موقعك
  • كيفية إضافة Live Ajax Search إلى WordPress الخاص بك بدون البرنامج المساعد

هيا نبدأ!

لماذا تضيف Live Search إلى موقعك

تعد إضافة البحث المباشر إلى موقعك مفيدة لعدة أسباب.

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

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

live search on a site

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

إنها أيضًا طريقة رائعة لجذب المزيد من الزيارات من محركات البحث نظرًا لأن Google تولي اهتمامًا كبيرًا لمتوسط ​​مدة الجلسة على الموقع.

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

عيوب إضافة Live Ajax Search بدون إضافة

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

هذا النهج له عدة عيوب خطيرة يجب أن تكون على دراية بها:

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

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

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

أسهل طريقة لإضافة Live Ajax Search إلى موقعك

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

SearchWP logo

SearchWP هو أفضل مكون إضافي للبحث في WordPress في السوق ، مع أكثر من 30000 تثبيت نشط.

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

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

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

فيما يلي بعض ميزات SearchWP الأخرى التي ستساعدك على تنمية أعمالك:

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

مع ذلك ، دعنا نرى كيف يمكنك تمكين البحث المباشر على موقعك باستخدام SearchWP.

الخطوة 1: تثبيت وتنشيط SearchWP على موقعك

للبدء ، ستحتاج إلى الحصول على نسختك من SearchWP.

بمجرد الانتهاء من ذلك ، انتقل إلى لوحة معلومات SearchWP وانقر فوق التنزيلات .

go to the Downloads tab

ثم اضغط على زر Download SearchWP واحفظ ملف ZIP الخاص بالمكون الإضافي على جهاز الكمبيوتر الخاص بك.

click Download SearchWP

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

copy your license key

الآن ستحتاج إلى تحميل ملف SearchWP ZIP إلى موقعك وتثبيت المكون الإضافي. تحقق من كيفية تثبيت البرنامج التعليمي لبرنامج WordPress الإضافي إذا كنت بحاجة إلى تذكير حول كيفية القيام بذلك ،

بعد تثبيت SearchWP ، ستحتاج إلى تنشيط نسخة المكون الإضافي الخاص بك باستخدام مفتاح الترخيص الخاص بك.

للقيام بذلك ، ضع مؤشر الماوس فوق الزر SearchWP في اللوحة العلوية من لوحة معلومات WordPress الخاصة بك وانقر فوق تنشيط الترخيص .

click Activate License

بعد الوصول إلى صفحة الترخيص ، الصق مفتاح ترخيص SearchWP في حقل الترخيص وانقر فوق تنشيط .

press Activate

بمجرد تنشيط الترخيص الخاص بك ، فأنت جاهز للانتقال إلى الخطوة التالية وتثبيت ملحق Live Search.

الخطوة 2: قم بتثبيت SearchWP Live Search Extension

يتيح لك تثبيت امتداد SearchWP هذا تمكين بحث Ajax المباشر على موقعك ببضع نقرات دون كتابة سطر واحد من التعليمات البرمجية.

للبدء ، انتقل إلى SearchWP »الإضافات على الجانب الأيسر من لوحة معلومات WordPress الخاصة بك.

go SearchWP Extensions

ثم ، ابحث عن ملحق Live Search وانقر فوق تثبيت ضمن قسمه.

click Install Live search

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

دعونا نرى كيف يعمل.

الخطوة 3: اختبر بحثك الجديد

للقيام بذلك ، انتقل إلى موقعك وقم بإجراء بحث.

على سبيل المثال ، إليك ما يبدو عليه بحث SearchWP Ajax المباشر على موقع الاختبار الخاص بنا:

how to add live search to your WordPress site without a plugin

الآن ، دعنا نرى كيف يمكنك إضافة بحث مباشر إلى موقعك بدون مكون إضافي.

كيفية إضافة Live Ajax Search إلى WordPress الخاص بك بدون البرنامج المساعد

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

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

سيسمح لك بالتبديل بسرعة إلى المظهر الرئيسي الخاص بك إذا فعلت شيئًا خاطئًا وتعطلت موقعك.

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

يمكنك التحقق من هذا البرنامج التعليمي حول كيفية إنشاء سمة فرعية لـ WordPress إذا كنت بحاجة إلى مساعدة في ذلك.

بعد إنشاء قالب فرعي ، انتقل إلى لوحة معلومات WordPress الخاصة بك وانتقل إلى المظهر »Theme File Editor .

go to the Theme Files Editor

ثم ابحث عن ملف jobs.php وانقر عليه لفتحه في محرر الملف.

open the Theme Functions file

بعد ذلك ، الصق الكود التالي في ملف functions.php الخاص بك:

<?php 
/*
 ==================
 Ajax Search
======================	 
*/
// add the ajax fetch js
add_action( 'wp_footer', 'ajax_fetch' );
function ajax_fetch() {
?>
<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-wp-preserve="%3Cscript%20type%3D%22text%2Fjavascript%22%3E%0Afunction%20fetch()%7B%0A%0A%20%20%20%20jQuery.ajax(%7B%0A%20%20%20%20%20%20%20%20url%3A%20'%3C%3Fphp%20echo%20admin_url('admin-ajax.php')%3B%20%3F%3E'%2C%0A%20%20%20%20%20%20%20%20type%3A%20'post'%2C%0A%20%20%20%20%20%20%20%20data%3A%20%7B%20action%3A%20'data_fetch'%2C%20keyword%3A%20jQuery('%23keyword').val()%20%7D%2C%0A%20%20%20%20%20%20%20%20success%3A%20function(data)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20jQuery('%23datafetch').html(%20data%20)%3B%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%7D)%3B%0A%0A%7D%0A%3C%2Fscript%3E" data-mce-resize="false" data-mce-placeholder="1" class="mce-object" width="20" height="20" alt="&lt;script&gt;" title="&lt;script&gt;" />

<?php
}

// 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();
}

بمجرد الانتهاء ، اضغط على تحديث الملف لحفظ التغييرات.

press Update File

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

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

هل تريد إضافة بحث مباشر إلى موقعك ببضع نقرات بدون تشفير؟ يمكنك البدء في SearchWP هنا.

هل تتساءل عن كيفية تمكين البحث عن طريق علامات النشر؟ تحقق من البرنامج التعليمي المفصل لدينا حول كيفية البحث عن المشاركات بالعلامات في WordPress.

تريد إخفاء بعض فئات المنشور من البحث؟ اتبع كيفية استبعاد فئة من دليل بحث WordPress.