คุณต้องการสร้างส่วนหัวที่กำหนดเองใน WordPress ด้วย Elementor หรือไม่?
ส่วนหัวเป็นหนึ่งในองค์ประกอบสำคัญที่ทุกเว็บไซต์ควรมี ส่วนหัวมักประกอบด้วยเมนู ทำให้ผู้เยี่ยมชมนำทางไปยังหน้าสำคัญในเว็บไซต์ของคุณได้ง่าย องค์ประกอบอื่นที่มักพบในส่วนหัวของเว็บไซต์คือโลโก้
ค้นพบ วิธีการติดตั้ง Elementor บน WordPress
มากที่สุด ธีม WordPressไม่ว่าจะฟรีหรือจ่ายเงิน ให้คุณปรับแต่งส่วนหัวโดยเพิ่มโลโก้เว็บไซต์หรือเมนูนำทาง บาง ธีม WordPressให้คุณเพิ่มองค์ประกอบเพิ่มเติม เช่น แถบค้นหาและไอคอนโซเชียลมีเดีย
แต่เป็นไปได้ไหมที่จะสร้างส่วนหัวที่กำหนดเองใน WordPress เพื่อแทนที่ส่วนหัวของ ธีม WordPress สินทรัพย์ ?
แน่นอน คุณสามารถสร้างส่วนหัวที่กำหนดเองเพื่อแทนที่ส่วนหัวเริ่มต้นสำหรับธีมที่ใช้งานอยู่ในปัจจุบันบนเว็บไซต์ WordPress ของคุณได้
หากคุณมีทักษะการเขียนโปรแกรม (PHP ในกรณีนี้) ให้สร้างส่วนหัวที่กำหนดเองสำหรับ a ธีม WordPress ไม่ใช่ปัญหาใหญ่ หากคุณไม่มีทักษะการเขียนโปรแกรม Elementor ให้คุณสร้างส่วนหัวที่กำหนดเองโดยไม่ต้องเขียนโค้ดแม้แต่บรรทัดเดียว คุณสามารถสร้างส่วนหัวโดยใช้ตัวแก้ไขแบบลากแล้วปล่อย
หมายเหตุ: ตัวสร้างธีมมีเฉพาะใน Elementor Pro เท่านั้น
วิธีสร้างส่วนหัวที่กำหนดเองใน WordPress ด้วย Elementor
Elementor รุ่นโปรมาพร้อมกับคุณสมบัติที่เรียกว่า feature ตัวสร้างธีม คุณสมบัตินี้ช่วยให้คุณสร้าง ธีม WordPress โดยไม่ต้องเข้ารหัส องค์ประกอบธีมที่คุณสามารถสร้างได้ด้วยตัวสร้างธีมของ Elementor ได้แก่:
- ส่วนหัว
- ฟุตบอล
- เทมเพลตโพสต์เดียว
- เทมเพลตหน้าที่เก็บถาวร
- เทมเพลตหน้า 404
ในบทความนี้เราจะแสดงวิธีสร้างส่วนหัวที่กำหนดเองสำหรับธีม WordPress ของคุณด้วย Elementor เมื่อเผยแพร่แล้ว ส่วนหัวที่กำหนดเองนี้จะแทนที่ส่วนหัวของธีมปัจจุบันของคุณ
ก่อนที่คุณจะเริ่ม ตรวจสอบให้แน่ใจว่าคุณได้ติดตั้งแล้ว Elementor Pro บนเว็บไซต์ WordPress ของคุณ
ก่อนอื่น ไปที่ เทมเพลต -> ตัวสร้างธีม.
ในหน้าตัวสร้างธีม ให้ไปที่แท็บ ส่วนหัว และคลิกที่ปุ่ม เพิ่มเกี่ยวกับ เพื่อสร้างส่วนหัวใหม่
หน้าต่างป๊อปอัปจะปรากฏขึ้นเพื่อขอให้คุณตั้งชื่อแม่แบบของคุณ พิมพ์ชื่อรุ่นของคุณและคลิกที่ปุ่ม click สร้างแบบจำลอง.
Elementor ช่วยให้คุณสร้างส่วนหัวจากเทมเพลตได้ เลือกรุ่นที่มีอยู่ในไลบรารีรุ่นและคลิกที่ปุ่ม click แทรก เพื่อโหลดลงในตัวแก้ไข Elementor
คุณยังสามารถสร้างส่วนหัวตั้งแต่เริ่มต้น หากคุณต้องการสร้างส่วนหัวตั้งแต่เริ่มต้น คุณสามารถปิดไลบรารีเทมเพลตเพื่อเปิดตัวแก้ไข Elementor
ในทางเทคนิค คุณสามารถเพิ่มวิดเจ็ต Elementor ใดๆ ก็ได้ ซึ่งคุณสามารถสำรวจได้จากแผงด้านซ้าย ไปที่ส่วนหัวของคุณ แต่ไม่จำเป็นต้องใช้วิดเจ็ตทั้งหมดในการสร้างส่วนหัวของเว็บไซต์
อ่านคำแนะนำของเรา: Elementor Free vs Elementor Pro: การเปรียบเทียบคุณสมบัติโดยละเอียด
ในบทความนี้ เราจะแสดงวิธีเพิ่มองค์ประกอบทั่วไปของส่วนหัว ได้แก่ โลโก้เว็บไซต์ เมนูการนำทาง และแถบค้นหา ในกรณีนี้ คุณจะต้องมีส่วนใหม่ที่มีสามคอลัมน์ คลิกไอคอนเครื่องหมายบวกในตัวแก้ไข Elementor และเลือกโครงสร้างสามคอลัมน์
กำหนดความกว้างของแต่ละคอลัมน์โดยลากตัวแบ่งไปทางซ้ายหรือขวา ดูที่การจับภาพด้านล่าง
- เพิ่มโลโก้เว็บไซต์
หากต้องการเพิ่มโลโก้เว็บไซต์ ให้ลากวิดเจ็ต โลโก้ของเว็บไซต์ จากแผงด้านซ้ายไปยังหนึ่งในคอลัมน์ในตัวแก้ไข Elementor
วิดเจ็ต โลโก้ของเว็บไซต์ จะโหลดโลโก้เว็บไซต์ของคุณ หากคุณไม่ได้ระบุโลโก้เว็บไซต์ของคุณ คุณสามารถไปที่ ลักษณะที่ปรากฏ -> ปรับแต่ง เพื่อเพิ่มโลโก้ของคุณ
อ่าน: วิธีการนำเข้าหรือส่งออกโมเดลใน Elementor
คุณสามารถปรับแต่งโลโก้ของคุณได้ทางแผงด้านซ้าย คุณสามารถกำหนดองค์ประกอบต่างๆ เช่น การจัดตำแหน่ง ลิงค์ ความกว้าง ฯลฯ
เพียงแค่เล่นกับแผงด้านซ้ายจนกว่าคุณจะพอใจกับผลลัพธ์
- เพิ่มเมนูนำทาง
หากต้องการเพิ่มเมนูการนำทาง ให้ลากวิดเจ็ต เมนูนำทาง ไปยังคอลัมน์ใดคอลัมน์หนึ่งในเอดิเตอร์ Elementor
วิดเจ็ต เมนูนำทาง จะโหลดเมนูหลักของเว็บไซต์ของคุณ หากคุณยังไม่ได้สร้างเมนูใดๆ บนเว็บไซต์ คุณสามารถไปที่ ลักษณะ -> เมนู เพื่อสร้าง หากคุณมีหลายเมนูในเว็บไซต์ คุณสามารถระบุได้ว่าต้องการแสดงเมนูใดจากเมนูดรอปดาวน์ตัวเลือก เมนู ของแผงด้านซ้าย
อีกครั้งคุณสามารถเล่นกับแผงด้านซ้ายเพื่อปรับแต่งเมนูของคุณ คุณสามารถตั้งค่าเลย์เอาต์ (แนวนอน แนวตั้ง) การจัดตำแหน่ง เอฟเฟกต์แอนิเมชั่น และอื่นๆ
- เพิ่มแถบค้นหา
หากต้องการเพิ่มแถบค้นหา คุณสามารถลากวิดเจ็ต แบบฟอร์มการค้นหา ในคอลัมน์ที่เหลือ
เมื่อ ฟอร์ม เพิ่ม คุณสามารถไปที่แผงด้านซ้ายเพื่อปรับแต่ง
ปรับแต่งส่วนหัว
ตามค่าเริ่มต้น ส่วนหัวของคุณจะมีพื้นหลังสีขาว คุณสามารถเปลี่ยนสีนี้เพื่อให้เข้ากับสีของธีมของคุณได้ ในการดำเนินการดังกล่าว ให้เปิดใช้งานส่วนโดยคลิกที่ส่วนนั้นในเบราว์เซอร์ (Ctrl + ผม).
ไปที่แท็บ สไตล์ บนแผงด้านซ้ายและเลือกสีที่คุณชื่นชอบโดยคลิกที่ตัวเลือกสีในตัวเลือก สี ของส่วน พื้นหลัง.
หากคุณต้องการมีส่วนหัวที่ติดหนึบ คุณสามารถไปที่แท็บ ขั้นสูง ในตัวเลือก เหนียว, ภายใต้ส่วน เอฟเฟกต์การเคลื่อนไหว, ตั้งค่าตำแหน่ง Sticky ตามค่าเริ่มต้น เอฟเฟกต์ Sticky จะถูกนำไปใช้กับอุปกรณ์ทุกประเภท (เดสก์ท็อป แท็บเล็ต และสมาร์ทโฟน)
อ่าน: Elementor Pro: 10 คุณสมบัติที่ยอดเยี่ยมในการปลดล็อก - ตอนที่ I
หากคุณต้องการปิดเอฟเฟกต์ Sticky บนอุปกรณ์บางประเภท เพียงแค่ลบอุปกรณ์ออกจากฟิลด์
เผยแพร่ส่วนหัวที่กำหนดเองของคุณ
จนถึงตอนนี้ คุณได้สร้างส่วนหัวที่กำหนดเองสำเร็จแล้ว มีตัวเลือกการปรับแต่งอื่นๆ มากมายที่คุณสามารถตั้งค่าได้ และไม่สามารถครอบคลุมทั้งหมดได้ในโพสต์นี้
ดูเพิ่มเติม: วิธีสร้างเทมเพลตโพสต์ที่ไม่ซ้ำกับ Elementor Pro
เพียงแค่เล่นกับแผงด้านซ้ายจนกว่าคุณจะพอใจกับผลลัพธ์จริงๆ เมื่อเสร็จแล้วให้คลิกปุ่ม Publier ที่ด้านล่างของแผงด้านซ้ายเพื่อเผยแพร่เทมเพลตส่วนหัวของคุณ
ในขั้นตอนต่อไป คุณจะถูกขอให้ตั้งค่าเงื่อนไขการแสดงผล คลิกที่ปุ่ม เพิ่มเงื่อนไข
โดยค่าเริ่มต้น เทมเพลตส่วนหัวของคุณจะถูกนำไปใช้กับทั้งเว็บไซต์ ดังนั้นหากคุณต้องการใช้เทมเพลตส่วนหัวของคุณกับทั้งเว็บไซต์ คุณก็แค่คลิกปุ่ม บันทึกและปิด.
อ่าน: วิธีสร้างส่วนท้ายใน WordPress ด้วย Elementor
หรือหากคุณต้องการใช้เทมเพลตส่วนหัวกับหน้าใดหน้าหนึ่ง คุณสามารถระบุหน้าได้โดยคลิกเมนูแบบเลื่อนลง เลือกหน้าจากเมนูดรอปดาวน์อื่นที่ปรากฏขึ้นถัดไป คลิกที่ปุ่ม บันทึกและปิด เมื่อคุณระบุหน้าเสร็จแล้ว
รับ Elementor Pro ทันที!
สรุป
ที่นี่ ! บทความนี้จะแสดงวิธีสร้างส่วนหัวที่กำหนดเองใน WordPress ด้วย Elementor หากคุณมีข้อสงสัยเกี่ยวกับวิธีการไปที่นั่น โปรดแจ้งให้เราทราบใน ความเห็น.
อย่างไรก็ตามคุณสามารถปรึกษาได้ ทรัพยากรของเราหากคุณต้องการองค์ประกอบเพิ่มเติมเพื่อดำเนินโครงการสร้างเว็บไซต์อินเทอร์เน็ตของคุณโดยปรึกษากับเราใน การสร้างบล็อก WordPress หรือที่อยู่บน Divi: ธีม WordPress ที่ดีที่สุดตลอดกาล.
แต่ในขณะเดียวกัน แบ่งปันบทความนี้ในเครือข่ายโซเชียลต่าง ๆ ของคุณ.
...