วิธีใช้ผลิตภัณฑ์กรองตามราคา WooCommerce Block

เผยแพร่แล้ว: 2021-12-22

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

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

ไปกันเถอะ!

วิธีเพิ่มผลิตภัณฑ์กรองตามราคาบล็อก WooCommerce ในโพสต์หรือหน้าของคุณ

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

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

การเพิ่มบล็อกผลิตภัณฑ์ทั้งหมดใน WooCommerce

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

การกำหนดค่าบล็อกผลิตภัณฑ์ทั้งหมด WooCommerce

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

การเพิ่มผลิตภัณฑ์กรองตามบล็อกราคาใน WooCommerce

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

ตัวกรองตามบล็อกราคาใน WooCommerce

คุณจะสังเกตเห็นว่าตัวเลื่อนไม่ทำงานภายในหน้าจอตัวแก้ไขของคุณ หากต้องการดูการทำงานของบล็อก คุณจะต้องดูตัวอย่างหน้า (หรือเผยแพร่และเข้าถึงจากส่วนหน้า) หากยังดูไม่ถูกต้อง ก็ไม่ต้องกังวล – มาพูดถึงวิธีกำหนดค่ากันดีกว่า

กรองผลิตภัณฑ์ตามราคา การตั้งค่าและตัวเลือกบล็อก WooCommerce

บล็อก กรองผลิตภัณฑ์ตามราคา ไม่มีการตั้งค่าที่หลากหลาย อย่างไรก็ตาม คุณสามารถกำหนดค่าลักษณะและการทำงานของบล็อกได้บางส่วน

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

การกำหนดค่าฟิลด์ราคาสำหรับผลิตภัณฑ์กรองตามบล็อคราคา

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

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

การกำหนดค่าตัวกรองผลิตภัณฑ์ตามบล็อคราคา

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

เคล็ดลับและแนวทางปฏิบัติที่ดีที่สุดสำหรับการใช้ผลิตภัณฑ์กรองตามราคา WooCommerce Block อย่างมีประสิทธิภาพ

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

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

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

กรองผลิตภัณฑ์ตามบล็อกราคาในการดำเนินการ

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

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

คำถามที่พบบ่อยเกี่ยวกับผลิตภัณฑ์กรองตามราคา WooCommerce Block

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

เหตุใดผลิตภัณฑ์กรองตามบล็อกราคาจึงไม่ทำงาน

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

ฉันสามารถแก้ไขราคาต่ำสุดและสูงสุดในผลิตภัณฑ์กรองตามช่วงราคาได้หรือไม่

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

บทสรุป

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

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

คุณมีคำถามใด ๆ เกี่ยวกับวิธีการใช้บล็อก กรองผลิตภัณฑ์ตามราคา หรือไม่? พูดคุยเกี่ยวกับพวกเขาในส่วนความคิดเห็นด้านล่าง!

ภาพเด่นโดย Bakhtiar Zein / shutterstock.com