วิธีสร้างเทมเพลตการโพสต์บล็อก Elementor แบบกำหนดเอง (คำแนะนำอย่างง่าย)

คุณกำลังมองหาบทช่วยสอนที่ง่ายที่สุดในการ สร้างเทมเพลตการโพสต์บล็อก Elementor ที่กำหนดเองหรือไม่?

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

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

ในบทความนี้ คุณจะได้เรียนรู้ วิธีสร้างเทมเพลตการโพสต์บล็อกของ Elementor โดยใช้สองวิธี ในวิธีที่ง่ายที่สุด ดังนั้นอ่านต่อ ...

ปลั๊กอินที่คุณต้องติดตั้งเพื่อสร้างเทมเพลตการโพสต์บล็อก Elementor ที่กำหนดเอง

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

• องค์ประกอบ (ฟรี)

• และ Elementor Pro

วิธีสร้างเทมเพลตหน้าบล็อกที่กำหนดเองของ Elementor ตั้งแต่เริ่มต้น

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

ขั้นตอนที่ 1: สร้างเทมเพลตบล็อกเดี่ยวใหม่

ขั้นแรก คุณต้องสร้างเทมเพลตบล็อกเดียว ไปที่ WordPress Dashboard จากนั้นไปที่ เทมเพลต ⇒ เพิ่มใหม่

และคลิกที่ปุ่มเพิ่มใหม่ เมื่อหน้าต่างใหม่เปิดขึ้น ให้เลือก Single Post เป็นประเภทของเทมเพลตจากเมนูดร็อปดาวน์ ระบุชื่อ ที่คุณต้องการ จากนั้นคลิก Create Template

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

ขั้นตอนที่ 2: เลือกโครงสร้าง/เค้าโครงสำหรับเทมเพลตโพสต์บล็อก

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

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

จากนั้นเลือก โพสต์ จากหน้า ตัวอย่างเนื้อหาไดนามิก เป็นดรอปดาวน์ พิมพ์ชื่อบล็อกที่คุณต้องการเลือกในรายการดรอปดาวน์ที่สองด้านล่าง สุดท้าย ให้คลิกที่ Apply & Preview

ขั้นตอนที่ 3: เพิ่มวิดเจ็ตรูปภาพเด่นและปรับแต่งตัวเลือกสไตล์รูปภาพ

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

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

หากต้องการเปลี่ยนการตั้งค่ารูปแบบ ให้ไปที่ แท็บรูปแบบ ที่นี่คุณสามารถเปลี่ยน ความสูงของผู้วิเศษ ความกว้าง ความทึบ เส้นขอบ รัศมี ฯลฯ

ขั้นตอนที่ 4: เพิ่มและปรับแต่งวิดเจ็ต Elementor Post Info

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

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

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

ขั้นตอนที่ 5: ลากและวางวิดเจ็ตชื่อโพสต์และปรับแต่ง

ตอนนี้ ค้นหาวิดเจ็ตชื่อโพสต์ แล้ว ลากและวาง ใต้วิดเจ็ตข้อมูลโพสต์

คุณสามารถกำหนด ขนาด แท็ก HTML และการจัดตำแหน่งของแท็กชื่อบทความได้

บนแท็บสไตล์ คุณจะพบตัวเลือกต่างๆ ในการปรับแต่ง สีข้อความ, วิชาการพิมพ์, Text Stroke, Text Shadow และ Blend Mode

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

ตอนนี้ ลากและวางวิดเจ็ตเนื้อหาโพสต์ วิดเจ็ตเนื้อหาโพสต์ของ ElementsKit แสดงถึงเนื้อหา (เนื้อหาหลัก) ของโพสต์ในบล็อก

ขั้นตอนที่ 7: ลากและวางวิดเจ็ตไอคอนโซเชียลเพื่อเพิ่มตัวเลือกการแชร์โซเชียล

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

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

ไปที่แท็บ ลักษณะ เพื่อเปลี่ยน ขนาดไอคอน สี ช่องว่างภายใน ระยะห่าง ประเภทเส้นขอบ

ขั้นตอนที่ 8: เพิ่มวิดเจ็ต Author Box และปรับแต่งการตั้งค่าของวิดเจ็ต

ค้นหา Author Box แล้วลากและวางวิดเจ็ตหลังไอคอนโซเชียล คุณยังสามารถเพิ่ม ผู้แต่งที่กำหนดเอง ได้หากต้องการจากดรอปดาวน์แหล่งที่มา คุณสามารถเลือก วิธี/ซ่อนรูปโปรไฟล์ ชื่อที่แสดง และประวัติ ได้ คุณยังสามารถปรับแต่งการตั้งค่าอื่นๆ เช่น แท็ก HTML, ลิงก์, เลย์เอาต์, การจัดตำแหน่ง

ไปที่แท็บ สไตล์ เพื่อปรับแต่งตัวเลือกต่างๆ เช่น ขนาดรูปภาพ เส้นขอบ สี และรูปแบบตัวอักษรของชื่อผู้แต่ง ชีวประวัติ ฯลฯ

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

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

คุณสามารถ แสดงหรือซ่อนป้ายกำกับการแบ่งหน้า หรือเครื่องหมายลูกศร คุณจะได้รับ ตัวเลือกการออกแบบมากกว่า 8 แบบสำหรับลูกศร คุณยังสามารถ ปรับแต่งข้อความก่อนหน้าและระดับถัดไปได้อีกด้วย

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

ขั้นตอนที่ 10: ลากและวางวิดเจ็ตโพสต์เพื่อแสดงโพสต์ที่เกี่ยวข้อง

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

ขั้นตอนที่ 11: เพิ่มวิดเจ็ตโพสต์ความคิดเห็น

ในการให้ตัวเลือกแก่ผู้ใช้ในการแสดงความคิดเห็นในโพสต์ของคุณ คุณต้องเพิ่มวิดเจ็ตความคิดเห็นของโพสต์ ค้นหาวิดเจ็ตความคิดเห็นของโพสต์แล้วลากและวางใต้วิดเจ็ตโพสต์

ขั้นตอนที่ 12: อัปเดตและดูเทมเพลตหน้าบล็อกที่กำหนดเองของ Elementor

เมื่อออกแบบเสร็จแล้ว ให้ คลิกที่ปุ่มอัปเดต หากหน้าต่างการตั้งค่าการเผยแพร่ปรากฏขึ้น ให้คลิกที่ บันทึกและปิด

นี่คือตัวอย่างเทมเพลตโพสต์บล็อก Elementor แบบกำหนดเองที่เราเพิ่งสร้างขึ้น

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

วิธีสร้างหน้าโพสต์เดียวโดยใช้เทมเพลต Elementor ที่สร้างไว้ล่วงหน้า

หากคุณวางแผนที่จะใช้เทมเพลตที่สร้างไว้ล่วงหน้าสำหรับหน้าบล็อกที่กำหนดเองของ Elementor คุณสามารถทำได้ใน 3 ขั้นตอน ตรวจสอบวิธีการ:

ขั้นตอนที่ 1: สร้างเทมเพลต Single Blog Post ใหม่จากแดชบอร์ด

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

ขั้นตอนที่ 2: เลือกเทมเพลต Elementor Single Post ที่สร้างไว้ล่วงหน้า

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

ขั้นตอนที่ 3: เลือกเทมเพลต Elementor Single Post ที่สร้างไว้ล่วงหน้า

เมื่อโหลดเทมเพลตแล้ว ให้ คลิกปุ่มเผยแพร่ เพื่อบันทึกเทมเพลตบล็อกใหม่ทั้งหมด

นี่คือรูปลักษณ์สุดท้ายของบล็อกโพสต์โดยใช้โพสต์บล็อก Elementor โดยใช้เทมเพลตโพสต์เดียวที่สร้างไว้ล่วงหน้า

วิธีสร้างหน้าโพสต์ล่าสุดของ Elementor ด้วย ElementsKit

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

ขั้นตอนที่ 1: ติดตั้งและเปิดใช้งาน ElementsKit

ในการสร้างหน้ารายการบล็อกที่สวยงาม พร้อมด้วยตัวสร้างหน้า Elementor คุณจะต้องมี ElementsKit ElementsKit เป็นปลั๊กอินแบบ all-in-one สำหรับ Elementor ที่มีวิดเจ็ตและโมดูลมากกว่า 85 รายการเพื่อให้การพัฒนาเว็บทำได้ง่ายกว่าที่เคย

ขั้นตอนที่ 2: เปิดใช้งานวิดเจ็ตที่เกี่ยวข้องกับรายการโพสต์

เมื่อเปิดใช้งานแล้ว คุณต้องเปิดวิดเจ็ตที่เกี่ยวข้องกับโพสต์เพื่อสร้างหน้ารายการโพสต์ ElementsKit มีวิดเจ็ตจำนวนหนึ่งเพื่อแสดงรายการบล็อกของคุณ ซึ่งรวมถึง Blog Posts, Post Grid, Post List, Post tab widget เป็นต้น คุณสามารถเปิดใช้งานวิดเจ็ตที่คุณต้องการใช้

ขั้นตอนที่ 3: เพิ่มวิดเจ็ตและปรับแต่ง

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

โพสต์บล็อก:

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

โพสต์กริด:

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

วิดเจ็ตแท็บโพสต์

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

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

คำพูดสุดท้าย

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

และอย่าลืมเพิ่มความพิเศษให้กับหน้ารายการบล็อกของคุณด้วยวิดเจ็ต ElementsKit ElementsKit เป็นส่วนประกอบที่สมบูรณ์แบบสำหรับ Elementor ให้เวลาเพื่อตรวจสอบวิดเจ็ตที่น่าทึ่งทั้งหมดที่ส่วนเสริมนี้มีให้