WooCommerce: Bagaimana Mengaktifkan Filter Produk (yaitu "Filter Ajax")?

Jika toko WooCommerce Anda memiliki banyak produk, pelanggan online mungkin akan mudah tersesat. Mungkin ada terlalu banyak halaman untuk dikunjungi ("pagination produk") sebelum menemukan produk yang mereka cari. Tak perlu dikatakan, ini adalah kerugian besar bagi bisnis Anda. Mungkin, mereka tidak akan pernah kembali.

Jika Anda berbelanja di situs web e-niaga populer seperti Amazon dan eBay, Anda tahu mereka masing-masing membawa satu miliar produk. Untungnya, di atas bilah pencarian yang sangat berguna, situs web ini menyediakan “ filter produk ” di bilah sisi. Anda dapat menyaring berdasarkan harga, ulasan, tag, kategori, dan sebagainya; situs web tidak akan "menyegarkan" tetapi sebaliknya akan segera mengembalikan hasil yang difilter pada halaman yang sama .

Ini disebut " Filter Produk Ajax " (Ajax adalah sekumpulan aplikasi yang berjalan di latar belakang tanpa memaksa penyegaran halaman situs web). Dan seperti yang baru saja dibuktikan oleh Amazon dan eBay kepada Anda, filter ini mutlak diperlukan jika Anda memiliki 100+ produk WooCommerce.

Untungnya, ada plugin untuk itu. Dan mereka gratis atau cukup murah bila Anda membandingkan biaya kecil ini dengan potensi Pengembalian Investasi (ROI) Anda.

Selain itu, jika Anda memiliki banyak produk, Anda juga sudah memiliki beberapa kategori produk WooCommerce, tag produk, atribut produk, bidang khusus produk, harga, status stok. Ini berarti bahwa menerapkan Filter Produk Ajax di toko WooCommerce Anda mungkin hanya dalam 10 menit : aktifkan plugin, pilih kriteria filter dan pengguna Anda akan secara otomatis melihat widget filter halus di bilah sisi!

Jadi, apa saja plugin “WooCommerce Ajax Product Filter” yang terbaik?

1. Widget Filter Produk Default WooCommerce (GRATIS)

Kejutan

WooCommerce memberi Anda widget filter produk secara default. Untuk menggunakan filter bawaan WooCommerce, buka Appearance > Widgets dan drag & drop filter berikut di sidebar Anda: “ Filter Produk berdasarkan Atribut ”, “ Filter Produk berdasarkan Rating ” dan “ Filter Produk berdasarkan Harga ”.

Beberapa produk pengujian saya memiliki atribut yang disebut "Ukuran", jadi saya menyiapkan widget "Filter Produk menurut Atribut" untuk memfilter ukuran produk. Ini semua otomatis, selama produk Anda memiliki atribut yang ada. Sekarang front-end terlihat seperti ini:

Dalam waktu sekitar 1 menit, saya dapat menambahkan filter berdasarkan atribut, peringkat, dan "penggeser" harga. Sangat mudah. Namun, ada dua masalah utama: filter WooCommerce ini tidak didukung oleh Ajax (karenanya halaman "dimuat ulang" setelah menggunakan salah satu filter) dan filternya terlalu terbatas . Hanya ada 3 widget default, Anda hanya dapat memiliki dropdown atau daftar atribut, hanya memiliki penggeser harga dan bukan daftar rentang harga ala Amazon… pada dasarnya Anda tidak dapat berbuat banyak dengan pengaturan ini.

Anda mungkin memerlukan widget yang lebih canggih, lebih banyak opsi desain, sistem bertenaga Ajax, dan sesuatu yang lebih kuat namun fleksibel.

2. Plugin Navigasi Berlapis yang Diaktifkan Ajax oleh WooCommerce (PREMIUM)

Plugin resmi oleh WooCommerce ini adalah langkah pertama yang bagus menuju kesempurnaan penyaringan produk. Plugin ini menyediakan UX yang lebih baik dan lebih banyak opsi widget daripada widget filter produk bawaan non-Ajax.

Setelah aktif, plugin Ajax-Enabled Enhanced Layered Navigation memberi Anda widget tambahan yang dapat Anda gunakan di halaman toko / arsip / kategori yang disebut " WooCommerce Ajax Layered Nav ".

Hal yang hebat tentang widget canggih ini adalah Anda dapat memutuskan bagaimana menampilkan filter atribut di front-end yaitu sebagai daftar, kotak centang, drop-down, atau pemilih label / contoh warna .

Sayang tidak ada demo yang bisa saya arahkan. Anda dapat menggunakan widget sebanyak yang Anda suka, tetapi tidak ada filter harga, filter peringkat, filter stok, dll. Ini hanya untuk atribut (ukuran, warna, dll) .

Jadi, kecuali ini cukup untuk tujuan Anda, plugin ini tidak lengkap.

3. Plugin Filter Produk WooCommerce Ajax oleh YITH (GRATIS & PREMIUM)

Ketika datang ke YITH, Anda tahu mereka memiliki plugin WooCommerce untuk semuanya… tentu saja mereka juga menjual plugin Filter Produk Ajax yang canggih.

Kabar baiknya adalah – ini juga hadir sebagai versi gratis (yang melakukan hal yang hampir sama dengan plugin premium WooCommerce yang kami jelaskan di bagian sebelumnya). Selain itu, dari halaman plugin Anda dapat melihat demo dan menguji produk sebelum membeli.

Setelah plugin premium aktif, Anda akan melihat 5 widget baru:

• Ajax Urutkan berdasarkan (ini mengurutkan produk sesuai dengan opsi penyortiran WooCommerce, tetapi melakukannya dengan Ajax!)
• Filter Produk Ajax (urutkan berdasarkan atribut / kategori / tag / merek dan tampilkan sebagai dropdown / kotak centang / daftar / carikan / label)
• Filter Harga Ajax (buat rentang harga dalam daftar yang dapat difilter)
• Ajax Stock/On Sale Filter (tambahkan widget untuk memfilter produk masuk/keluar yang sedang dijual atau tersedia)
• Filter Reset Ajax (setel ulang filter dengan satu klik)

Ini backendnya:

Dan ini adalah halaman Toko setelah widget filter ini aktif:

Anda memiliki kombinasi filter tak terbatas dan dapat menggunakan beberapa widget "Filter Produk Ajax". Ini berarti di bilah sisi yang sama Anda dapat memfilter menurut atribut, tag, kategori, harga, dan/atau merek secara bersamaan . Dan tanpa menyegarkan halaman – hasil langsung ditampilkan.

Seperti yang dapat Anda bayangkan, Filter Produk YITH WooCommerce Ajax kompatibel dengan semua plugin YITH lainnya dan karenanya dapat melakukan hal-hal yang cukup canggih.

Anda juga dapat "beralih" setiap widget dan membuatnya "tertutup" secara default. Selain itu, dalam setiap widget Anda dapat memilih / membatalkan pilihan atribut / tag / kategori mana yang harus dikecualikan dari filter .

Ya, ini sangat fleksibel. Dan itu berhasil.

4. FacetWP (PREMIUM)

Last but not least, FacetWP, alat pemfilteran yang kuat juga kompatibel dengan WooCommerce, adalah produk yang sangat canggih untuk pengembang – jika Anda ingin memanfaatkannya, beberapa pengetahuan teknis memang diperlukan. Muncul dengan kait, kode pendek, pengkodean dan integrasi Ajax yang digerakkan oleh kinerja.

Untuk menambahkan filter, Anda harus menambahkan kode pendek ke dalam widget teks atau – lebih baik lagi – menambahkannya melalui PHP ke dalam file tema Anda (ini berarti Anda juga dapat menampilkan filter di luar bilah sisi ).

FacetWP memungkinkan Anda membuat beberapa "segi", yaitu tampilan filter, seperti:

• kotak centang
• tarik-turun
• fPilih
• Radio
• Hirarki
• Penggeser
• Mencari
• Pelengkapan otomatis
• Rentang Tanggal
• Rentang Angka
• Peringkat Bintang
• Kedekatan

Berkenaan dengan WooCommerce, setiap faset atau filter produk dapat menargetkan sumber data berikut:

1. Harga
2. Harga penjualan
3. Harga normal
4. Penilaian rata-rata
5. Status Stok (dalam stok / habis)
6. Dijual
7. Kategori Produk
8. Tag produk
9. Atribut produk

Seperti yang Anda lihat, membuat aspek WooCommerce cukup mudah:

FacetWP hadir dengan dokumentasi pengembang yang hebat dan harus dimiliki untuk proyek-proyek lanjutan. Jika, di sisi lain, FacetWP terlalu banyak untuk Anda, maka preferensi saya adalah plugin Filter Produk YITH WooCommerce Ajax.

5. JetSmartFilters oleh Crocoblock

JetSmartFilters oleh Crocoblock adalah plugin yang mudah digunakan dengan sistem filter berbasis AJAX dan 9 widget praktis yang membuat situs web WooCommerce ramah pengguna tanpa menulis satu baris kode pun:

1. Filter peringkat – mengatur produk berdasarkan peringkat.
2. Filter visual – sangat efektif untuk toko online yang menyediakan berbagai warna atau merek.
3. Filter pencarian – memungkinkan pencarian baik dengan kata atau frase dan dengan cepat menampilkan hasil yang sesuai.
4. Filter radio – menyediakan opsi untuk memilih satu produk atau kiriman dari daftar.
5. Filter kotak centang – memungkinkan memilih beberapa opsi dari daftar periksa.
6. Rentang Tanggal – pilihan yang baik jika Anda akan memfilter postingan atau produk berdasarkan tanggal penambahannya atau acara menurut tanggal saat postingan atau produk tersebut seharusnya diadakan.
7. Filter Periksa Rentang – membantu membuat berbagai opsi dalam bentuk daftar kotak centang .
8. Filter rentang – memungkinkan Anda mengatur rentang pencarian dengan bantuan penggeser .
9. Pilih filter – memungkinkan memilih opsi dalam bentuk daftar drop-down .

Widget tambahan di dalam plugin JetSmartFilters membantu pengguna situs web menelusuri produk yang relevan tanpa menyegarkan halaman, melihat filter yang saat ini diterapkan, dan menghapus yang diperlukan untuk kenyamanan lebih.

JetSmartFilters terhubung erat dengan addon lain yang diproduksi oleh Crocoblock – JetWooBuilder. Plugin ini adalah alat yang harus dimiliki untuk pembuat situs web e-niaga karena menyediakan opsi serbaguna untuk menampilkan produk mulai dari berbagai variasi kisi produk hingga formulir ulasan dan penilaian.