วิธีสร้างแกลเลอรีรูปภาพด้วยการค้นหาที่กรองสำหรับเว็บไซต์ WordPress

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

โชคดีที่ปลั๊กอิน WordPress มีมานานแล้ว แต่ก็ยังไม่ง่ายอย่างที่คุณต้องการ

แกลเลอรีรูปภาพการค้นหาที่กรองคืออะไร

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

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

เหตุใดคุณจึงต้องการเสนอการค้นหาแบบกรองบนเว็บไซต์ของคุณ

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

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

หลายปีที่ผ่านมาฉันได้ลองใช้เครื่องมือทุกอย่างที่หาได้เพื่อตั้งค่าการค้นหาแบบกรอง บางอย่างยอดเยี่ยม บางอย่างไม่ค่อยดีนัก

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

นี่คือสิ่งที่ฉันทำเพื่อให้การค้นหาแบบกรอง (พารามิเตอร์) ทำงานบนไซต์เฉพาะของฉัน

ต่อไปนี้ใช้ภาพหน้าจอของแกลเลอรีตัวอย่าง

ข้ามไปที่แกลเลอรี่ภาพตัวอย่างด้วยการค้นหาที่กรอง!

ขั้นตอนที่ 1: ปลั๊กอิน UI ประเภทโพสต์ที่กำหนดเอง

• ฟรี

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

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

นี่คือภาพหน้าจอที่แสดงวิธีสร้างอนุกรมวิธานแบบกำหนดเองด้วยปลั๊กอิน UI ของประเภทโพสต์ที่กำหนดเอง:

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

ตัวอย่างเช่น หากคุณกำลังสร้างเว็บไซต์เกี่ยวกับรถยนต์ อนุกรมวิธานแบบกำหนดเองที่คุณจะสร้างในหน้าจอด้านบนจะเป็น "สี" เกณฑ์/ตัวเลือกที่คุณกำหนดสำหรับ "สี" จะเป็น "สีแดง" "สีขาว" "สีน้ำเงิน" ฯลฯ

ขั้นตอนที่ 2: ปลั๊กอินไลบรารีสื่อที่ปรับปรุงแล้ว

• เวอร์ชันฟรีและพรีเมียม

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

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

เพื่อให้กล่องกาเครื่องหมายแสดงในไลบรารีสื่อ ให้ทำดังต่อไปนี้:

การตั้งค่า => สื่อ => Media Taxonomies (เป็นแท็บ) => เลื่อนหน้าลงมาที่ส่วน “ตัวเลือก” ดังที่แสดงด้านล่าง:

ขั้นตอนที่ 3: อัปโหลดรูปภาพหรือสร้างโพสต์ของคุณ

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

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

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

เมื่อคุณอัปโหลดรูปภาพแล้ว เมื่อคุณคลิกรูปภาพในไลบรารีสื่อ การจัดหมวดหมู่และหมวดหมู่สื่อที่กำหนดเองของคุณจะแสดงขึ้นทางด้านขวาดังนี้ (ดูภาพหน้าจอด้านล่าง):

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

FYI ปลั๊กอิน Enhanced Media Library เวอร์ชัน Pro อนุญาตให้ติดแท็กจำนวนมากได้ แต่เมื่อคุณทำเช่นนั้น คุณต้องใช้ตัวเลือกเดียวกันนี้กับรูปภาพทั้งหมดที่คุณเลือกสำหรับการแท็กจำนวนมาก ฉันสามารถพูดได้ว่ารุ่น Pro นั้นคุ้มค่ากับคุณสมบัตินี้ไปด้วย

ขั้นตอนที่ 4: ปลั๊กอินมุมมองเนื้อหา Pro (CVP)

• เวอร์ชันฟรีและพรีเมียม

เครื่องมือสุดท้ายในการตั้งค่าทั้งหมดนี้คือปลั๊กอิน Content Views Pro (อ่านรีวิว Content Views Pro ฉบับเต็มของฉันที่นี่) แม้ว่าจะมีเวอร์ชันฟรี แต่คุณจะต้องใช้เวอร์ชันโปรหากต้องการแสดงเครื่องมือค้นหาที่ผ่านการกรองบนเว็บไซต์ของคุณ FYI, CVP เรียกมันว่าเครื่องมือกรอง "shuffle filter"

การสร้างแกลเลอรีรูปภาพการค้นหาที่กรองแล้วหรือตารางโพสต์นั้นง่ายมากด้วย CVP

เพียงทำดังต่อไปนี้:

สังเกตในภาพหน้าจอด้านบนว่าสำหรับ "ประเภทเนื้อหา" ฉันเลือก "สื่อ" นั่นสำหรับภาพ อย่างไรก็ตาม ด้วย Content Views Pro คุณสามารถสร้างแกลเลอรีเหล่านี้ด้วยโพสต์ ประเภทโพสต์ที่กำหนดเอง เพจ และคูปอง

ด้านล่างนี้ คุณจะต้องตั้งค่าว่ารูปภาพใดที่คุณต้องการกรองเข้าหรือออกจากแกลเลอรี

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

สุดท้าย ตั้งค่าตัวกรองการสุ่ม:

Content Views Pro จะกรองตามโพสต์หรือประเภทโพสต์ที่กำหนดเองหรือไม่

ใช่. เป็นมากกว่าปลั๊กอินแกลเลอรี เป็นกริดที่ยอดเยี่ยมและปลั๊กอินการค้นหาและแกลเลอรีที่ผ่านการกรองแล้ว ทั้งหมดนี้รวมอยู่ในเครื่องมือที่มีประโยชน์อย่างเหลือเชื่อสำหรับเว็บไซต์ WordPress

ขั้นตอนที่ 5: ใส่แกลเลอรีของคุณในโพสต์หรือหน้าด้วยรหัสย่อ CVP

ขั้นตอนสุดท้ายคือการใช้รหัสย่อ CVP และวางไว้ในโพสต์หรือหน้าเว็บที่คุณกรองแกลเลอรีการค้นหา / ตารางโพสต์จะปรากฏขึ้น

นี้เป็นเรื่องง่ายสุด เพียงคัดลอกรหัสย่อที่สร้างโดย CVP

ด้านล่างนี้คือตัวอย่างแกลเลอรีรูปภาพที่สามารถค้นหาผ่านตัวกรองได้

ขั้นตอนที่ 6: เพิ่มเนื้อหาเพิ่มเติม (ไม่บังคับ)

คุณอาจพิจารณาเพิ่มเนื้อหาเพิ่มเติมในโพสต์/หน้าที่คุณแสดงแกลเลอรีการค้นหาหรือตารางโพสต์ที่กรองแล้ว มันขึ้นอยู่กับคุณ ฉันมักจะเพิ่มอย่างน้อย 150 คำ; มักเพิ่มเนื้อหา 400 ถึง 600 คำก่อนและหลังแกลเลอรี

นั่นคือทั้งหมดที่มีให้

อีก 2 ตัวเลือกเด็ดๆ ให้ลอง

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

1. FacetWP:

สิ่งนี้สร้างหน้าการค้นหาพารามิเตอร์ที่ดีจริงๆ แต่การใช้งานนั้นซับซ้อนกว่า Content Views Pro คุณจำเป็นต้องรู้ PHP สักเล็กน้อย แต่ถ้าคุณทำให้มันใช้งานได้ ผลลัพธ์ก็น่าทึ่ง นี่คือการสาธิต ใช่ คุณจะประทับใจ คุณสามารถหลีกเลี่ยงข้อกำหนด PHP ด้วย Caldera Clarity สำหรับ FacetWP

ฉันเคยใช้ทั้ง FacetWP และ Caldera Clarity มันใช้งานได้ดี แต่เนื่องจาก Content Views Pro นั้นใช้งานง่ายกว่าและเร็วกว่าในการสร้างแกลเลอรีการค้นหาที่มีการกรองจำนวนมาก ฉันจึงติดอยู่กับ CVP ที่กล่าวว่าฉันสามารถเห็นได้ทั้งหมดว่าทำไมคนถึงเลือกใช้ FacetWP อินเทอร์เฟซการค้นหานั้นยอดเยี่ยม

2. ประเภท WP:

นักพัฒนารายนี้มีชุดปลั๊กอินและธีมเต็มรูปแบบที่คุณสามารถซื้อได้เพื่อสร้างเว็บไซต์การค้นหาพารามิเตอร์ที่ซับซ้อนอย่างยิ่ง อย่างไรก็ตาม มีช่วงการเรียนรู้ที่สูงชัน ฉันซื้อมันมาและพยายามแล้วยอมแพ้… ยอมแพ้ง่าย ๆ เพราะตอนนี้ฉันรู้แล้วว่าการใช้ Content Views Pro นั้นง่ายเพียงใด นี่คือไซต์งานแสดงบางส่วน

ที่ฉันแนะนำ?

หากคุณเชี่ยวชาญด้านเทคโนโลยี CSS และการเข้ารหัส ฉันเชื่อว่า WP Types เป็นปลั๊กอินการค้นหาที่มีการกรองที่มีประสิทธิภาพและซับซ้อนที่สุด มันสามารถทำได้มากมาย แต่มันไม่ง่ายเลยที่จะเรียนรู้

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

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