วิธีออกแบบบล็อก Elementor โดยใช้ปลั๊กอินและวิด WP Latest Posts

Elementor คือเครื่องมือสร้างเพจที่ช่วยให้เราสร้างและออกแบบเพจด้วยบล็อกที่ใช้งานง่าย แต่การรวมเข้ากับ WP Lates Post จะช่วยให้เราสร้างเพจบล็อกที่น่าทึ่งด้วยโพสต์บนไซต์ของเราได้

WP Latest Post ช่วยให้เราสร้างส่วนต่างๆ ที่แสดงตัวอย่างบทความจำนวนหนึ่งตามตัวกรองและธีมที่สวยงามได้! ทำให้เราสร้างชุดส่วนต่างๆ ในหน้าเว็บของเราได้ง่ายๆ เพียงไม่กี่ขั้นตอน

ในบทความนี้ เราจะมาดูวิธีการสร้างหน้าบล็อกโดยใช้ Elementor และ WP Latest Post ในไม่กี่ขั้นตอนง่ายๆ

สร้างบล็อกโพสต์ WordPress

อันดับแรก เราต้องสร้างบล็อกโพสต์ก่อน เพื่อกำหนดโพสต์ที่เราจะเพิ่มลงในเนื้อหาของเรา ว่าเราต้องการแสดงโพสต์ทั้งหมดหรือเฉพาะบางโพสต์เท่านั้น

ขั้นแรก ไปที่ WP Latest Post > All New Blocks ในเมนูด้านซ้าย เราจะเห็น +New Block คลิกที่ปุ่มนั้น

ขั้นแรก เราสามารถกำหนดชื่อเรื่องก่อน จากนั้นจึงดำเนินการสร้างบล็อกต่อไป

การสร้างบล็อกนี้จะแบ่งออกเป็น 3 ขั้นตอน โดยขั้นตอนแรกคือ การสร้างแหล่งข้อมูล (Source )

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

เนื่องจากเราจะสร้างบล็อก ในบทเรียนนี้เราจะเลือกตัวเลือก "โพสต์".

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

หมวดหมู่: หากเราต้องการแสดงเฉพาะบางหมวดหมู่เท่านั้น

เรียงลำดับ/ลำดับการแสดงผล: กำหนดลำดับการแสดงผลของโพสต์ของเราว่าจะเรียงตามวันที่สร้าง หรือเรียงจากน้อยไปมากหรือจากมากไปน้อย

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

วันที่เผยแพร่: กำหนดว่าเราต้องการแสดงเฉพาะโพสต์ที่เผยแพร่ก่อนหรือหลังวันที่ที่ระบุหรือไม่

เนื้อหาที่สร้างขึ้นล่าสุด: วิธีนี้จะช่วยให้เราสามารถกำหนดชุดโพสต์ที่เฉพาะเจาะจงมากขึ้นสำหรับชั่วโมง/วัน/เดือน/ปีล่าสุดได้

การรวมเนื้อหา :
  เพื่อกำหนดว่าเราต้องการแสดงหมวดหมู่หนึ่งครั้งหรือหลายครั้ง

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

ตอนนี้จะสิ้นสุดการตั้งค่าแหล่งที่มา และทำให้เราสามารถไปยังส่วนที่สองของการตั้งค่าบล็อกนี้ ซึ่งก็คือ การแสดงผลและธีม โดยเราจะสามารถตั้งค่าธีมได้จาก 8 ธีมที่มีให้เลือกสำหรับ WP Latest Post ( +Addon )

ตัวเลือกแรกที่เราจะเห็นคือ ธีม และปรับการตั้งค่า โดยจะมีค่าการตั้งค่าที่แตกต่างกันไปตามธีมที่เราเลือก และยังมีตัวอย่างให้ดูด้วย ลองตรวจสอบธีมที่มีให้เลือกกันเลย!

ธีมเริ่มต้น.

ตารางหมวดหมู่

ธีม Masonry

ธีมแนวนอนของวัสดุ

ธีมแนวตั้งของวัสดุ

ธีมผลงาน

ธีมโฮเวอร์ที่ราบรื่น

ธีมไทม์ไลน์

เราจะเห็นว่ามีตัวเลือกมากมายที่สามารถปรับให้เข้ากับสไตล์และเนื้อหาของหน้าเว็บของเราได้อย่างลงตัว! ในกรณีของบทเรียนนี้ เราจะเลือกใช้ ธีม Masonry ดังนั้นมาเลือกธีมนี้กันเลย!

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

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

เราสามารถปรับแต่งไอคอนที่แสดงเมื่อวางเมาส์เหนือไอคอนได้ตามต้องการ รวมถึงเลือกใช้ไอคอนเริ่มต้นที่ WP Latest Post มีให้เลือก หรืออัปโหลดไอคอนของเราเองก็ได้

ตัวเลือกสุดท้ายในส่วนนี้คือ Animation ซึ่งใช้ได้กับธีมที่มีแอนิเมชั่นอยู่แล้ว เช่น Smooth hover ที่ทำงานเหมือนสไลเดอร์ แต่สำหรับตัวอย่างนี้ เราเลือกใช้ธีม Masonry ซึ่งไม่มีแอนิเมชั่น ดังนั้นเราจึงไม่จำเป็นต้องแก้ไขอะไรในส่วนนี้

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

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

สร้างบล็อกโดยใช้ Widget ของ Elementor

เมื่อเรารู้วิธีสร้างบล็อกโพสต์โดยใช้ WP Latest Posts แล้ว ขั้นตอนต่อไปคือการเพิ่มบล็อกโพสต์โดยใช้ Elementor widget กัน

ในการทำเช่นนี้ เราสามารถไปที่หน้าบล็อกของเรา หรือสร้างหน้าใหม่โดยไปที่ หน้า > เพิ่มใหม่ แล้วคลิกที่ แก้ไขด้วย Elementor

โปรแกรมสร้างเว็บไซต์ Elementor จะโหลดโดยอัตโนมัติพร้อมตัวเลือกการเลือกวิดเจ็ตในแถบด้านข้าง ในช่องค้นหานี้ ให้พิมพ์ WP Latest Post ซึ่งจะแสดงวิดเจ็ตสำหรับบล็อกโพสต์ของเรา จากนั้นลากและวางลงในเนื้อหาของหน้าเว็บ

เมื่อเราโหลดวิดเจ็ตเสร็จแล้ว เราสามารถดำเนินการเลือกบล็อกโพสต์ในตัวเลือกวิดเจ็ตที่ปรากฏในแถบด้านซ้ายได้

ส่วนแสดงตัวอย่างบล็อกโพสต์ของเราจะปรากฏขึ้น ซึ่งเราจะเห็นชื่อของบล็อกโพสต์ รวมถึงโพสต์ที่เราเลือกไว้ให้แสดงอยู่ที่นั่น เพียงแค่คลิก 2 ครั้งก็เสร็จเรียบร้อย! เราได้สร้างหน้าบล็อกที่ปรับแต่งเองได้แล้ว และเราสามารถปรับแต่งได้มากเท่าที่เราต้องการโดยใช้เครื่องมือที่ยอดเยี่ยมของ Elementor

ตอนนี้สิ่งที่เราต้องทำก็คือเผยแพร่หน้าบล็อกของเรา และทุกอย่างก็จะเรียบร้อย บล็อกของเราก็เสร็จแล้ว!

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

สร้างส่วนข่าว WordPress ที่ดีที่สุดได้อย่างง่ายดาย

เนื่องจากวิดเจ็ต Elementor เป็นเพียงหนึ่งในคุณสมบัติที่ WP Latest Post นำเสนอ เราจึงมั่นใจได้ว่าธีมและเครื่องมือต่างๆ ที่มีอยู่ในนั้นจะช่วยให้เราสร้างส่วนข่าวสารที่มีดีไซน์ที่ดีที่สุดและง่ายที่สุดเท่าที่จะเป็นไปได้

ปลั๊กอินนี้มีฟีเจอร์มากมาย เช่น การใช้ Custom Post Types, Categories หรือแม้แต่ WooCommerce Products เป็นแหล่งที่มาของบล็อก ทำให้มีตัวเลือกมากมายไม่จำกัดในการสร้างและเพิ่มบล็อก ดังนั้นคุณจะรออะไรอยู่ รีบไป ที่นี่ และดาวน์โหลด WP Latest Post สำหรับเว็บไซต์ของคุณได้เลย!