ตัวกรองผลิตภัณฑ์ WooCommerce ตามคุณสมบัติ หมวดหมู่ ราคา และอื่นๆ อีกมากมาย

เผยแพร่แล้ว: 2022-09-01

เจ้าของเว็บไซต์ WooCommerce ทุกคนต้องการเพิ่มยอดขาย แต่เพื่อการนั้น เราต้องให้สภาพแวดล้อมที่ยืดหยุ่นแก่ผู้ซื้อในขณะที่พวกเขากำลังเยี่ยมชมเว็บไซต์ของเรา แต่ปัญหาที่พบบ่อยที่สุดประการหนึ่งคือเราไม่สามารถแสดงผลิตภัณฑ์ที่ผู้ซื้อกำลังมองหาได้ ปัญหานี้มักเกิดขึ้นเมื่อเรามีผลิตภัณฑ์หลายประเภทหลายประเภท แล้วต้องทำอย่างไร?

การจำกัดหมวดหมู่ผลิตภัณฑ์หรือจำนวนผลิตภัณฑ์ในร้านค้า WooCommerce ของเราดูเหมือนจะเป็นวิธีแก้ปัญหา แต่จริงๆแล้วไม่ใช่ เนื่องจากเราต้องเพิ่มจำนวนสินค้าเพื่อเพิ่มยอดขายของเรา มีโซลูชันที่ชาญฉลาดกว่าที่ไซต์อีคอมเมิร์ซยักษ์ใหญ่ทั้งหมดใช้อยู่ ตัวกรองผลิตภัณฑ์ WooCommerce เป็นทางออกที่ดีที่สุดสำหรับปัญหาประเภทนี้

หากคุณกำลังคิดว่า WooCommerce มีตัวเลือกการจัดเรียงผลิตภัณฑ์ตามค่าเริ่มต้นอยู่แล้ว แต่ยังไม่เพียงพอสำหรับร้านค้าออนไลน์ที่มีสินค้าหลากหลายประเภท เราต้องให้ผู้ซื้อกรองสินค้าตามคุณสมบัติ หมวดหมู่ หรือแม้แต่ช่วงราคาที่พวกเขาต้องการ

ตอนนี้คำถามคือจะเพิ่มตัวกรองผลิตภัณฑ์ไปยังร้านค้า WooCommerce ได้อย่างไร นั่นคือสิ่งที่เราจะสำรวจในโพสต์บล็อกนี้ แต่ก่อนจะลงรายละเอียด เราต้องมีความชัดเจนว่าตัวกรองผลิตภัณฑ์ของเราคืออะไร และเหตุใดเราจึงควรเพิ่มคุณลักษณะการกรองผลิตภัณฑ์ไปยังร้านค้า WooCommerce ของเรา อย่างไรก็ตาม หากคุณคุ้นเคยกับสิ่งนี้ คุณสามารถข้ามไปยังส่วนการสอนของโพสต์ในบล็อกนี้ได้

เนื้อหา ซ่อน

1 ตัวกรองผลิตภัณฑ์ WooCommerce คืออะไร?

2 เหตุใดเราจึงควรเพิ่มตัวกรองผลิตภัณฑ์ไปยังร้านค้า WooCommerce

3 แนะนำบล็อกกรองผลิตภัณฑ์ WooCommerce ของ ProductX

4 วิธีเพิ่มตัวกรองผลิตภัณฑ์ WooCommerce ในหน้าร้านค้าโดยใช้ ProductX

4.1 เปิดโปรแกรมเสริมตัวสร้าง

4.2 สร้างเทมเพลตหน้าร้านค้าใหม่

4.3 เพิ่มตัวกรองผลิตภัณฑ์ WooCommerce ไปที่หน้าร้านค้า

5 ตัวเลือกการปรับแต่งตัวกรองผลิตภัณฑ์ WooCommerce

6 บทสรุป

ตัวกรองผลิตภัณฑ์ WooCommerce คืออะไร?

ตัวกรองผลิตภัณฑ์ WooCommerce หมายถึงการอนุญาตให้ผู้ซื้อค้นหาผลิตภัณฑ์ที่ต้องการตามเกณฑ์หลายประการ ซึ่งรวมถึงคุณลักษณะของผลิตภัณฑ์ หมวดหมู่ ราคา การให้คะแนน สี ขนาด ฯลฯ ซึ่งช่วยให้ผู้ซื้อค้นหาผลิตภัณฑ์ที่ต้องการได้อย่างง่ายดาย

ตัวอย่างเช่น ต้องการซื้อเสื้อยืดสีแดงขนาดกลางภายในงบประมาณ $5 ถึง $10 สำหรับสิ่งนั้น เขา/เธอสามารถใช้หมวดหมู่เสื้อผ้าหรือหมวดหมู่ย่อยเสื้อยืด เลือกสื่อจากตัวเลือกการเลือกขนาด และกำหนดช่วงราคาที่ต้องการ ดังนั้นผู้ซื้อจึงสามารถรับสินค้าได้อย่างง่ายดายหากมีอยู่ในร้าน

ทำไมเราควรเพิ่มตัวกรองผลิตภัณฑ์ไปยังร้านค้า WooCommerce?

การเพิ่มการกรองผลิตภัณฑ์จะต้องมีคุณสมบัติสำหรับร้านค้าอีคอมเมิร์ซไม่ว่าจะสร้างด้วย WooCommerce หรือไม่ก็ตาม มีเหตุผลมากมายที่อยู่เบื้องหลังคำกล่าวนี้ แต่เหตุผลหลักคือด้วยคุณสมบัติการกรองทั้งเจ้าของร้านค้าและผู้ซื้อสามารถได้รับประโยชน์พร้อมกัน ยังไง?

ลองนึกถึงสิ่งที่เราทำขณะซื้อของแบบออฟไลน์ ส่วนใหญ่เราแบ่งปันความต้องการของเราในการจัดเก็บเจ้าของ/พนักงานขาย จากนั้นเขาก็แสดงผลิตภัณฑ์หรือแนะนำเราไปยังพื้นที่ที่เราสามารถผลิตผลิตภัณฑ์ได้ตามความต้องการของเรา เรามอบประสบการณ์เดียวกันกับผู้ซื้อด้วยคุณสมบัติการกรองผลิตภัณฑ์ ด้วยเหตุนี้ นักช็อปจะพึงพอใจกับความยืดหยุ่น และในฐานะเจ้าของร้านค้าออนไลน์ เราสามารถเพิ่มยอดขายได้เนื่องจากลูกค้าส่วนใหญ่จะกลายเป็นลูกค้าที่กลับมาซื้อซ้ำ

แนะนำบล็อกกรองผลิตภัณฑ์ WooCommerce ของ ProductX

ราวกับว่าคุณมาไกลแล้วในขณะที่อ่านโพสต์บนบล็อกเหล่านี้ นั่นหมายความว่าคุณต้องการให้ผู้ซื้อกรองผลิตภัณฑ์ของร้านค้า WooCommerce ของคุณจริงๆ มีสองวิธีในการทำเช่นนั้น คุณสามารถจ้างนักพัฒนาหรือใช้ปลั๊กอินการกรองผลิตภัณฑ์

ฉันเดาว่าคุณยินดีที่จะใช้ปลั๊กอินเนื่องจากคุณอยู่ในระบบนิเวศของ WordPress และ WooCommerce แล้ว เรามีปลั๊กอินที่สมบูรณ์แบบสำหรับคุณ ซึ่งไม่เพียงแต่ช่วยให้คุณเพิ่มคุณสมบัติการกรองผลิตภัณฑ์ แต่ยังขยายขีดความสามารถของ WooCommerce ด้วยคุณสมบัติมากมายและส่วนเสริมต่างๆ

ProductX เป็นโซลูชันแบบครบวงจรสำหรับร้านค้า WooCommerce ที่ออกแบบมาอย่างประณีตเพื่อให้แน่ใจว่าคุณลักษณะที่จำเป็นทั้งหมดภายในปลั๊กอินเดียว เพื่อที่คุณจะไม่ใช้ปลั๊กอินหลายตัว อย่างไรก็ตาม ให้เรายึดตามหัวข้อหลักและคุณสามารถเรียนรู้เพิ่มเติมเกี่ยวกับข้อเสนอ ProductX ได้โดยคลิกที่นี่

ดังนั้น หากคุณต้องการเพิ่มตัวกรองผลิตภัณฑ์ WooCommerce โดยใช้ผลิตภัณฑ์ คุณต้องใช้ปลั๊กอินนี้เป็นโซลูชันที่สมบูรณ์ ตัวอย่างเช่น คุณต้องการเพิ่มคุณสมบัติการกรองไปยังหน้าร้านค้า เพื่อที่คุณจะต้องสร้างหน้าร้านค้าที่กำหนดเองด้วยคุณสมบัติตัวกรองผลิตภัณฑ์ เพื่อที่คุณจะได้เปลี่ยนหน้าร้านค้าของ WooCommerce ที่เป็นค่าเริ่มต้นได้อย่างสมบูรณ์ด้วยหน้าเพจที่เน้นการแปลง ตอนนี้เรามาดูกันว่าเราจะทำอะไรได้บ้างกับการกรองบล็อคของ ProductX

ตัวกรองผลิตภัณฑ์ WooCommerce ตามคุณสมบัติ
ตัวกรองผลิตภัณฑ์ WooCommerce ตามราคา
กรองสินค้า WooCommerce ตามหมวดหมู่
ตัวกรองผลิตภัณฑ์ WooCommerce โดย
ค้นหาผลิตภัณฑ์อาแจ็กซ์

วิธีเพิ่มตัวกรองผลิตภัณฑ์ WooCommerce ในหน้าร้านค้าโดยใช้ ProductX

ตอนนี้ มาดูกันว่าเราจะเพิ่มตัวเลือกการกรองผลิตภัณฑ์ไปยังหน้าร้านค้าที่กำหนดเองได้อย่างไร เพื่อที่คุณสามารถทำตามขั้นตอนด้านล่าง:

เปิดโปรแกรมเสริมตัวสร้าง

ก่อนอื่น ตรวจสอบให้แน่ใจว่าคุณได้ติดตั้งและเปิดใช้งานปลั๊กอิน ProductX บนไซต์ของคุณอย่างถูกต้อง ในขณะที่เรากำลังจะสร้างหน้าร้านค้าที่กำหนดเอง เราต้องเปิดโปรแกรมเสริมตัวสร้าง WooCommere นี่คือวิธี:

Turn on WooCommerce Builder Addon — เปิดโปรแกรมเสริมตัวสร้าง WooCommerce

ไปที่ส่วน ProductX
ตอนนี้คลิกที่ส่วนเสริม
เปิดตัวสร้างจากตัวเลือกที่มี

สร้างเทมเพลตหน้าร้านค้าใหม่

ตอนนี้ เราต้องเริ่มสร้างเทมเพลตใหม่สำหรับหน้าร้านค้าที่เราจะแสดงผลิตภัณฑ์พร้อมตัวเลือกการกรองทั้งหมด สำหรับการที่:

Create a new WooCommerce shop page template — สร้างเทมเพลตหน้าร้านค้าใหม่

คลิกที่ตัวเลือกตัวสร้างของ ProductX
คลิกที่ปุ่ม “เพิ่มใหม่”
ตั้งชื่อแม่แบบ
เลือกร้านค้าเป็นประเภทเทมเพลต
คลิกที่ปุ่มบันทึกและเริ่มปรับแต่ง

หากคุณต้องการเรียนรู้เพิ่มเติมเกี่ยวกับการสร้างและปรับแต่งหน้าร้านค้า WooCommerce โปรดดูบล็อกโดยคลิกที่นี่

เพิ่มตัวกรองผลิตภัณฑ์ WooCommerce ไปที่หน้าร้านค้า

ตอนนี้ได้เวลาเพิ่มบล็อกตัวกรองผลิตภัณฑ์ WooCommerce ในหน้าร้านค้า ก่อนอื่น ตัดสินใจว่าคุณต้องการเพิ่มตัวเลือกการกรองที่ด้านซ้ายหรือด้านขวา และคุณต้องการเพิ่มบล็อคผลิตภัณฑ์ใด ProductX หลายตารางผลิตภัณฑ์และบล็อกรายการผลิตภัณฑ์

ตัวอย่างเช่น ฉันต้องการเพิ่มบล็อกกริดผลิตภัณฑ์ที่มีตัวเลือกการกรองทางด้านซ้าย เพื่อที่ฉันต้องเพิ่มบล็อกคอลัมน์ที่มีอัตราส่วน 30/70

จากนั้นฉันกำลังเพิ่มบล็อกตัวกรองผลิตภัณฑ์ทางด้านซ้ายและบล็อกตารางผลิตภัณฑ์ #1 ทางด้านขวาของบล็อกคอลัมน์

Adding Product Filter and Product Grid Blocks — การเพิ่มตัวกรองผลิตภัณฑ์และบล็อกกริดผลิตภัณฑ์

หลังจากเพิ่มบล็อกแล้ว เรายังต้องเชื่อมต่อตัวเลือกการกรองกับบล็อกผลิตภัณฑ์โดยคลิกที่ตัวเลือกดรอปดาวน์ ดังที่คุณเห็นในภาพด้านล่าง

Connecting Filter Blocks with Product Grid Blocks — การเชื่อมต่อบล็อคตัวกรองกับ Product Grid Blocks

นั่นคือทั้งหมด ตัวเลือกการกรองจะพร้อมใช้งานสำหรับกลุ่มผลิตภัณฑ์เฉพาะ แต่ให้อ่านบล็อกโพสต์ และตรวจสอบตัวเลือกการปรับแต่งที่มีอยู่ของตัวกรองผลิตภัณฑ์ และหากคุณต้องการสำรวจตัวเลือกการปรับแต่งหน้าร้านค้า ให้ไปที่บล็อกโดยคลิกที่นี่

ตัวเลือกการปรับแต่งตัวกรองผลิตภัณฑ์ WooCommerce

แม้ว่าจะไม่จำเป็นต้องปรับแต่งบล็อกตัวกรองผลิตภัณฑ์เนื่องจากมีการจัดเรียงค่อนข้างดี อย่างไรก็ตาม เราเชื่อว่าผู้คนต่างมีทางเลือกที่แตกต่างกัน ดังนั้นจึงไม่เป็นไรหากคุณไม่ชอบการนำเสนอที่เป็นค่าเริ่มต้น ต่อไปนี้คือตัวเลือกที่มีอยู่หากคุณต้องการเปลี่ยนแปลง:

การเพิ่มหรือลบตัวเลือกการกรอง: จากตัวเลือกการเลือกรายการตัวกรอง คุณสามารถเพิ่มหรือลบตัวเลือกการกรองได้ เพื่อให้คุณควบคุมได้ว่าจะแสดงตัวเลือกใดและไม่แสดง

Adding or Removing Filtering Options — การเพิ่มหรือลบตัวเลือกการกรอง

การ กรองข้อความป้ายกำกับ: จากส่วนนี้ คุณสามารถเปลี่ยนข้อความป้ายกำกับของตัวเลือกการกรองด้วยข้อความใดก็ได้ที่คุณต้องการ

Filter Label Text — กรองข้อความป้ายกำกับ

สไตล์การค้นหา: คุณลักษณะการค้นหา ajax ของ ProductX มีตัวเลือกการปรับแต่งมากมาย คุณสามารถเปลี่ยนสีและสีพื้นหลัง และปรับรัศมีเส้นขอบและช่องว่างภายในได้

Ajax Search Filter Customization Options — ตัวเลือกการปรับแต่งตัวกรองการค้นหา Ajax

บทสรุป

นั่นคือทั้งหมดที่เกี่ยวกับตัวกรองผลิตภัณฑ์ WooCommerce ตอนนี้คุณสามารถเริ่มสร้างหน้าร้านค้าแบบกำหนดเองด้วยตัวเลือกการกรองเพื่อให้ผู้ซื้อของคุณค้นหาผลิตภัณฑ์ของตนได้อย่างง่ายดาย หากคุณประสบปัญหาใด ๆ หรือมีคำถามใด ๆ โปรดแสดงความคิดเห็นด้านล่าง เรารอคอยที่จะได้ยินจากคุณ

แท็ก: ตัวกรองผลิตภัณฑ์ Ajax ตัวกรองผลิตภัณฑ์ProductXWooCommerce Product Filter