วิธีซ่อนหรือปรับแต่งรูปแบบของหมวดหมู่ย่อยใน WordPress
คุณต้องการซ่อนหมวดหมู่ย่อยใน WordPress หรือปรับแต่งสไตล์เพื่อให้รายการหมวดหมู่ของคุณอ่านง่ายขึ้นหรือไม่?
ใน WordPress คุณสามารถจัดระเบียบโพสต์โดยใช้หมวดหมู่หลักและหมวดหมู่ย่อย ซึ่งช่วยให้การนำทางดีขึ้นและเป็นประโยชน์ต่อ SEO อย่างไรก็ตาม จากประสบการณ์ของเรา รายการหมวดหมู่ย่อยที่ยาวเกินไปอาจทำให้เว็บไซต์ของคุณดูรก
ในบทความนี้ เราจะแสดงวิธีซ่อนหมวดหมู่ย่อยและปรับแต่งสไตล์ของมันโดยใช้โค้ด CSS
ทำไมต้องใช้หมวดหมู่ย่อยใน WordPress?
เมื่อคุณเขียนโพสต์บน WordPress การจัดหมวดหมู่เนื้อหาให้เป็นระเบียบสามารถช่วยให้ SEO ดีขึ้น และนำทราฟฟิกมายังเว็บไซต์ของคุณมากขึ้น อีกทั้งยังช่วยให้ผู้เข้าชมสามารถค้นหาสิ่งที่ต้องการได้ง่ายขึ้น
คุณสามารถสร้างหมวดหมู่ย่อยเมื่อโครงสร้างเว็บไซต์ของคุณซับซ้อนขึ้น ตัวอย่างเช่น บล็อกท่องเที่ยวอาจมีหมวดหมู่เกี่ยวกับสถานที่ท่องเที่ยวในสหรัฐอเมริกา และเมื่อเนื้อหาเพิ่มขึ้น อาจต้องสร้างหมวดหมู่ย่อยสำหรับเมืองต่างๆ เช่น ชิคาโก ลอสแอนเจลิส และนิวยอร์ก
หากคุณแสดงหมวดหมู่บน WordPress widget คุณสามารถเลือกแสดงเป็นรายการปกติหรือแบบลำดับชั้น นี่คือตัวอย่างการแสดงผล
วิธีแสดงหมวดหมู่ย่อยในรูปแบบลำดับชั้น
คุณสามารถเปิดใช้งานได้โดยไปที่ รูปแบบเว็บไซต์ (Appearance) » วิดเจ็ต (Widgets) บนแผงควบคุม WordPress และทำเครื่องหมายที่ช่อง ‘แสดงลำดับชั้น (Show hierarchy)’
อย่างไรก็ตาม ไม่ว่าคุณจะเลือกแบบไหน รายการหมวดหมู่ของคุณอาจยาวเกินไปและดูไม่เป็นระเบียบ เราจะแสดงวิธีซ่อนหมวดหมู่ย่อยและปรับแต่งให้ดูดีขึ้น
วิธีซ่อนหมวดหมู่ย่อยใน WordPress ด้วย CSS
คุณสามารถใช้โค้ด CSS เพื่อซ่อนหมวดหมู่ย่อยได้ โดยสามารถเพิ่มโค้ดนี้ลงในไฟล์ style.css ของธีม ปลั๊กอินสำหรับโค้ด เช่น WPCode หรือในตัวแก้ไข Theme Customizer ของ WordPress
โค้ด CSS สำหรับซ่อนหมวดหมู่ย่อย
.children {
display: none;
}
วิธีเพิ่มโค้ด CSS ผ่าน Theme Customizer
- ไปที่ รูปแบบเว็บไซต์ (Appearance) » ปรับแต่ง (Customize)
- เลื่อนลงและคลิกที่ CSS เพิ่มเติม (Additional CSS)
- วางโค้ด CSS ที่ต้องการลงไป
- กด เผยแพร่ (Publish)
หลังจากเพิ่มโค้ดแล้ว ให้เข้าไปดูเว็บไซต์ของคุณเพื่อยืนยันว่าหมวดหมู่ย่อยถูกซ่อนแล้ว
วิธีปรับแต่งสไตล์ของหมวดหมู่ย่อยใน WordPress ด้วย CSS
หากคุณต้องการให้หมวดหมู่ย่อยดูเป็นระเบียบมากขึ้น คุณสามารถใช้ CSS เพื่อกำหนดสไตล์ได้
ตัวอย่างโค้ด CSS สำหรับปรับแต่งหมวดหมู่ย่อย
.children {
padding: 0 0 0 5px;
margin: 0 0 0 2px;
border-left: 1px solid #333;
}
วิธีเพิ่มโค้ด CSS
ทำตามขั้นตอนเดียวกับการซ่อนหมวดหมู่ย่อย โดยเพิ่มโค้ดนี้แทน
เมื่อทำเสร็จแล้ว ให้ตรวจสอบผลลัพธ์บนเว็บไซต์ของคุณและปรับแต่ง CSS เพิ่มเติมตามต้องการ
เราหวังว่าบทความนี้จะช่วยให้คุณสามารถซ่อนหรือปรับแต่งหมวดหมู่ย่อยใน WordPress ได้อย่างง่ายดาย หากคุณสนใจปลั๊กอินที่ช่วยให้เว็บไซต์ของคุณเติบโต ลองดูรายการปลั๊กอินที่จำเป็นสำหรับ WordPress หรืออ่านวิธีแสดงโพสต์ที่เกี่ยวข้องใน WordPress ของเรา
