جستجوی زنده محصولات ووکامرس با افزونه رایگان YITH

وقتی تعداد محصولات فروشگاهتون زیاد می‌شه، جستجوی معمولی ممکنه مشتری رو برای پیدا‌کردن یک محصول مشخص معطل کنه. جستجوی زنده کار رو راحت‌تر می‌کنه؛ مشتری بخشی از نام محصول رو می‌نویسه و پیشنهادهای مرتبط، بدون بارگذاری دوباره صفحه، جلوش ظاهر می‌شن.

توی این آموزش با نسخه رایگان افزونه YITH WooCommerce Ajax Search پیش می‌ریم. اول می‌بینیم خود وردپرس و ووکامرس چه ابزارهایی برای جستجو دارن. بعد افزونه رو نصب و تنظیم می‌کنیم، فرم جستجو رو با بلوک داخل سایت می‌ذاریم و در آخر هم عملکردش رو آزمایش می‌کنیم و سراغ ایرادهای رایج می‌ریم.

جستجوی زنده محصولات ووکامرس چطور کار می‌کنه؟

جستجوی زنده یا Ajax Search یعنی پیشنهادها هم‌زمان با تایپ مشتری نمایش داده می‌شن. پس لازم نیست برای دیدن هر نتیجه، کل صفحه دوباره بارگذاری بشه. AJAX اسم روشی هست که مرورگر با کمک اون اطلاعات تازه رو از سایت می‌گیره و فقط قسمت موردنیاز صفحه رو تغییر می‌ده.

این قابلیت برای فروشگاه‌هایی که محصولات زیاد یا چند محصول با اسم‌های شبیه به هم دارن، خیلی به کار میاد. البته جستجوی زنده به‌تنهایی باعث فروش بیشتر نمی‌شه. انتخاب نام روشن برای محصولات، کامل‌بودن اطلاعات هر محصول، سرعت هاست و جای فرم جستجو هم روی تجربه مشتری اثر می‌ذارن.

آیا خود وردپرس جستجوی زنده محصولات رو داره؟

خود وردپرس بلوک جستجو داره، ولی این بلوک برای جستجوی عمومی بین محتوای سایت ساخته شده و جای جستجوی زنده مخصوص محصولات رو نمی‌گیره. ووکامرس هم بلوک جستجوی محصول رو در اختیارتون می‌ذاره، اما ظاهر و نحوه کار اون به نسخه ووکامرس و قالب سایتتون بستگی داره.

قبل از اینکه افزونه تازه‌ای نصب کنید، توی ویرایشگر بلوکی عبارت «جستجوی محصول» رو جستجو کنید. شاید همون بلوکی که ووکامرس در اختیارتون گذاشته، نیاز فروشگاهتون رو برطرف کنه. ولی اگه می‌خواید پیشنهادها موقع تایپ مشتری نمایش داده بشن، نسخه رایگان YITH یکی از گزینه‌هایی هست که می‌تونید امتحانش کنید.

نصب افزونه رایگان YITH WooCommerce Ajax Search

برای انجام این آموزش، ووکامرس باید روی سایتتون نصب و فعال باشه و دست‌کم چند محصول منتشرشده داشته باشید. قبل از نصب افزونه هم از سایت نسخه پشتیبان بگیرید. همین‌طور مطمئن بشید نسخه‌های وردپرس، ووکامرس و PHP هاستتون با نیازمندی‌های صفحه رسمی افزونه هماهنگ هستن.

از پیشخوان وردپرس به «افزونه‌ها ← افزودن افزونه تازه» برید. عبارت «YITH WooCommerce Ajax Search» رو جستجو کنید و افزونه‌ای رو پیدا کنید که سازنده اون YITH هست. روی «نصب» بزنید و بعد افزونه رو فعال کنید. تمام مراحل این آموزش بر اساس نسخه رایگان موجود در مخزن رسمی وردپرس هستن.

بعد از فعال‌سازی، باید افزونه رو توی فهرست افزونه‌های فعال ببینید. یادتون نره که اگه ووکامرس فعال نباشه، جستجوی مخصوص محصولات درست کار نمی‌کنه. پس همین‌جا فعال‌بودن هر دو افزونه رو بررسی کنید.

راه‌اندازی جستجوی زنده محصولات ووکامرس

بعد از فعال‌کردن افزونه، از منوی YITH وارد بخش Ajax Search بشید. نکته مهم اینه که نسخه رایگان ممکنه گزینه‌ای برای نوشتن متن داخل کادر جستجو نشون نده. پس اگه چنین فیلدی توی پنل شما نیست، چیزی رو اشتباه نصب نکردید و لازم نیست دنبالش بگردید.

فعلاً تنظیماتی رو تغییر بدید که واقعاً توی نسخه نصب‌شده می‌بینید. اگه بخشی برای انتخاب قسمت‌های قابل جستجو دارید، مشخص کنید افزونه بین کدوم اطلاعات محصولات بگرده. گزینه‌هایی که کنار اون‌ها برچسب Premium دیده می‌شه، به نسخه پولی مربوط هستن و توی این آموزش ازشون استفاده نمی‌کنیم.

اگه گزینه‌ای برای حداقل تعداد کاراکترها یا تعداد نتیجه‌ها می‌بینید، می‌تونید مقدار اولیه رو با توجه به فروشگاهتون تنظیم کنید. برای نمونه، شروع جستجو بعد از نوشتن ۲ یا ۳ حرف معمولاً نقطه مناسبی برای آزمایش هست. تعداد کمی نتیجه هم فهرست پیشنهادها رو خلوت‌تر نگه می‌داره. اگه این گزینه‌ها توی نسخه شما نیستن، از این مرحله رد بشید و تنظیمات پیش‌فرض افزونه رو نگه دارید.

اگه دکمه‌ای برای ساخت یا بازسازی ایندکس می‌بینید، بعد از انتخاب گزینه‌های جستجو اون رو بزنید. ایندکس یک فهرست آماده از اطلاعات محصولات هست که به افزونه کمک می‌کنه نتیجه‌ها رو پیدا کنه. صبر کنید فرایند کامل بشه و بعد تغییرات رو ذخیره کنید. متن داخل کادر جستجو رو هم فقط وقتی تغییر بدید که چنین گزینه‌ای واقعاً داخل تنظیمات فرم یا بلوک YITH در اختیارتون باشه.

اضافه‌کردن فرم جستجو به فروشگاه

برگه موردنظرتون رو با ویرایشگر بلوکی باز کنید و روی علامت «+» بزنید. عبارت YITH یا Ajax Search رو جستجو کنید و بلوک جستجوی افزونه رو به برگه اضافه کنید. بعد برگه رو ذخیره کنید و پیش‌نمایش اون رو ببینید تا مطمئن بشید فرم در جای مناسبی قرار گرفته.

اگه قالب سایتتون بلوکیه، می‌تونید از مسیر «نمایش ← ویرایشگر» همین بلوک رو داخل سربرگ قالب بذارید تا توی صفحه‌های بیشتری دیده بشه. قبل از ذخیره تغییرات، ظاهر سربرگ رو روی موبایل هم ببینید و مطمئن بشید کادر جستجو از عرض صفحه بیرون نمی‌زنه.

اگه از قالب کلاسیک استفاده می‌کنید، سری هم به بخش «نمایش ← ابزارک‌ها» بزنید. اگه افزونه ابزارک اختصاصی در اختیارتون گذاشته، می‌تونید اون رو به بخشی مثل سایدبار اضافه کنید. با این حال، برای سایت‌های جدید روش بلوکی ساده‌تره و دستتون رو برای چیدن صفحه بازتر می‌ذاره.

اگه می‌خواید یک گزینه رایگان دیگه رو هم بررسی کنید، آموزش جستجوی آژاکس محصولات با Advanced Woo Search رو ببینید. بهتره فقط یکی از افزونه‌های جستجوی زنده رو فعال نگه دارید؛ چون چند فرم مشابه یا اسکریپت هم‌زمان ممکنه با هم تداخل پیدا کنن.

آزمایش جستجوی زنده محصولات

حالا از حساب مدیریت خارج بشید یا سایت رو توی یک پنجره ناشناس باز کنید. بخشی از نام یکی از محصولات منتشرشده رو بنویسید و ببینید پیشنهادها بدون تازه‌شدن کامل صفحه نمایش داده می‌شن یا نه. بهتره جستجو رو یک بار با نام کامل، یک بار با بخشی از نام و یک بار هم با عبارتی نامرتبط امتحان کنید.

آزمایش روی موبایل رو هم جدی بگیرید. فهرست نتیجه‌ها نباید از صفحه بیرون بزنه و مشتری باید بتونه بدون لمس اشتباه، محصول موردنظرش رو انتخاب کنه. سرعت نمایش پیشنهادها رو با یک اینترنت معمولی هم بسنجید؛ چون نتیجه‌ای که با اینترنت سریع می‌بینید، همیشه تجربه واقعی همه مشتری‌ها نیست.

رفع مشکلات رایج جستجوی زنده

• هیچ نتیجه‌ای نمایش داده نمی‌شه: بررسی کنید که محصول منتشر شده باشه، ووکامرس فعال باشه و ساخت ایندکس افزونه کامل شده باشه.
• محصول تازه اضافه‌شده پیدا نمی‌شه: ایندکس جستجو رو دوباره بسازید و بعد کش سایت رو پاک کنید.
• نتیجه فقط بعد از زدن دکمه جستجو میاد: کش و بهینه‌سازی JavaScript رو موقتاً غیرفعال کنید و دوباره جستجو رو آزمایش کنید. JavaScript کدی هست که قسمت تعاملی جستجو رو داخل مرورگر اجرا می‌کنه.
• ظاهر نتیجه‌ها به‌هم ریخته: اول افزونه و قالب رو به‌روز کنید. بعد سراغ تداخل استایل قالب یا افزونه‌های بهینه‌سازی برید.
• جستجو کند شده: تعداد نتیجه‌های فوری رو کمتر کنید، ایندکس رو از نو بسازید و منابع هاست رو هم بررسی کنید.

اگه با غیرفعال‌کردن کش مشکل برطرف شد، گزینه‌های بهینه‌سازی رو یکی‌یکی فعال کنید تا تنظیم ناسازگار رو پیدا کنید. بهتره این آزمایش رو اول روی نسخه آزمایشی سایت انجام بدید تا فروشگاه اصلی همچنان در دسترس مشتری‌ها بمونه.

سؤالات متداول

تیم تولید محتوا

ما در تیم تولید محتوای میهن وردپرس در تلاش هستیم تا بهترین مقالات آموزشی در زمینه وردپرس و کسب‌و‌کارهای اینترنتی را تهیه کنیم. صحت محتوای این صفحه توسط رضا راد بررسی خواهد شد.