Divi: ธีม WordPress ที่ดีที่สุดของเวลาทั้งหมด!

ขึ้น ดาวน์โหลด 901.000 แล้วDivi เป็นธีม WordPress ที่ได้รับความนิยมมากที่สุดในโลก สมบูรณ์และใช้งานง่ายและมาพร้อมกับเทมเพลตฟรีมากกว่า 62

คุณต้องการค้นหาวิธีปรับแต่งธีม WordPress ด้วยปลั๊กอิน Elementor หรือไม่?

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

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

โชคดีกับ Elementor, กระบวนการนี้กลายเป็นเรื่องง่ายมากดังนั้นคุณอาจต้องการตรวจสอบ

แต่ก่อนอื่นมาค้นพบด้วยกัน วิธีการติดตั้งขั้นตอน 7 บล็อก WordPress et วิธีการหาติดตั้งและเปิดใช้งานธีมเวิร์ดเพรสบนบล็อกของคุณ.

จากนั้นกลับไปที่สาเหตุที่เราอยู่ที่นี่

ธีม WordPress คืออะไร

โดยพื้นฐานแล้วธีม WordPress คือชุดของเทมเพลตที่กำหนดรูปลักษณ์ของเว็บไซต์ WordPress

ธีม WordPress ครอบคลุมทุกสิ่งที่มีผลต่อการออกแบบเว็บไซต์ตั้งแต่ส่วนหัวและส่วนท้ายไปจนถึงโทนสีเค้าโครงและอื่น ๆ

มีธีมให้เลือกมากมาย ทั้งแบบฟรีและแบบพรีเมียม ซึ่งเข้ากับอุตสาหกรรมแทบทุกประเภท เช่น เว็บไซต์ถ่ายภาพ, เว็บไซต์สโมสรยิม, เว็บไซต์ร้านทำผม, เว็บไซต์กฎหมายและอื่น ๆ

ทำไมต้องปรับแต่งธีม WordPress

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

คุณนึกภาพออกไหมว่า Amazon, eBay หรือ Google คือสิ่งที่พวกเขาเป็นโดยไม่มีการออกแบบที่เป็นเอกลักษณ์

ไม่แน่นอนและนั่นเป็นเหตุผลหนึ่งที่เราต้องการปรับแต่งธีม WordPress เราต้องการทำให้เป็นเอกลักษณ์และปรับให้เข้ากับข้อความของ บริษัท ของเรา

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

วิธีปรับแต่งธีม WordPress

มีหลายวิธีในการปรับแต่งธีม WordPress

  1. ด้วยตนเองผ่านเครื่องมือปรับแต่ง WordPress
  2. พร้อมรหัส
  3. ด้วย Elementor

วิธีปรับแต่งธีม WordPress ด้วยตนเอง

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

ก่อนที่เราจะเจาะลึกลงไปในพื้นที่นี้เราอยากจะชี้ให้เห็นว่าเมื่อคุณปรับแต่งธีม WordPress ที่มีอยู่คุณควรใช้ ธีมลูกไม่ใช่ธีมหลัก.

ธีมลูกของ WordPress

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

เครื่องมือปรับแต่งธีม WordPress

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

คุณสมบัติหลักที่คุณสามารถปรับเปลี่ยนได้ด้วย Customizer นี้มีดังนี้:

การเพิ่มชื่อเว็บไซต์โลโก้และไอคอน

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

การเปลี่ยนสีของธีม WordPress

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

เพิ่มเมนูการนำทาง

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

วิธีปรับแต่งธีม WordPress ด้วยโค้ด

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

ที่นี่คุณจะสามารถเข้าถึงไฟล์เช่น style.css, function.phpและนี่คือสถานการณ์ที่คุณจะต้องมีธีมลูกเพื่อที่คุณจะได้ไม่ทำลายเว็บไซต์ของคุณ

อีกวิธีหนึ่งในการปรับแต่งธีมของคุณด้วยการเข้ารหัสคือการอัปโหลดไฟล์โดยใช้โซลูชัน FTP กระบวนการนี้เกี่ยวข้องกับการสร้างข้อมูลรับรอง FTP ผ่านผู้ให้บริการโฮสติ้งของคุณดาวน์โหลดและติดตั้งโซลูชัน FTP (เช่น FileZilla) เข้าสู่ระบบบัญชีของคุณและแก้ไขไฟล์ของคุณจากนั้นคุณจะอัปโหลดผ่านทางเดียวกัน โซลูชัน FTP

ค้นหาคำแนะนำของเรา วิธีติดตั้ง WordPress ด้วย FileZilla

เราไม่แนะนำตัวเลือกนี้เว้นแต่คุณจะคุ้นเคยกับการเขียนโค้ด

ปรับแต่งธีม WordPress ได้อย่างง่ายดายด้วย Elementor

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

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

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

ปรับแต่งส่วนหัวและส่วนท้าย

Elementor ช่วยให้คุณมีความยืดหยุ่นอย่างสมบูรณ์ในการออกแบบส่วนหัวและส่วนท้ายของคุณ เราทุกคนรู้ดีว่ามันน่าเบื่อแค่ไหนที่คุณมีธีม WordPress และคุณไม่สามารถเปลี่ยนการออกแบบส่วนหัวหรือส่วนท้ายเพียงด้านเดียวได้ คุณต้องการธีมพิเศษปลั๊กอิน ฯลฯ

ด้วย Elementor มันง่ายมาก

1. สร้างเทมเพลตส่วนหัว

ก่อนอื่นให้กำหนดค่าเทมเพลตส่วนหัวใหม่ โดยไปที่ Elementor> เทมเพลตของฉัน

วิธีปรับแต่งเทมเพลตส่วนหัวขององค์ประกอบธีมเวิร์ดเพรส 1

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

วิธีปรับแต่งเทมเพลตส่วนหัวขององค์ประกอบธีมเวิร์ดเพรส 2

คุณยังสามารถเข้าถึงหน้าจอนี้ได้โดยคลิกที่แท็บ Header จากหน้าจอก่อนหน้าจากนั้นกดปุ่มสีเขียวขนาดใหญ่ที่ปรากฏขึ้น

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

มันจะพาคุณมาที่นี่

วิธีปรับแต่งเทมเพลตส่วนหัวขององค์ประกอบธีมเวิร์ดเพรส 4

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

สร้างเว็บไซต์ของคุณอย่างง่ายดายด้วย Elementor

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

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

วิธีปรับแต่งเทมเพลตส่วนหัวขององค์ประกอบธีมเวิร์ดเพรส 5

มิฉะนั้นหากคุณต้องการเริ่มต้นใหม่เพียงแค่ปิดหน้าต่างโดยคลิก X ที่มุมขวาบน

2. เปลี่ยนการออกแบบส่วนหัวพื้นฐาน

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

วิธีปรับแต่งเทมเพลตส่วนหัวขององค์ประกอบธีมเวิร์ดเพรส 6

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

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

วิธีปรับแต่งเทมเพลตส่วนหัวขององค์ประกอบธีมเวิร์ดเพรส 7

นี่คือสิ่งที่คุณสามารถควบคุมได้ในเมนูต่างๆ:

  • แบบ - ควบคุมความกว้างของส่วนขนาดของช่องว่างระหว่างคอลัมน์ความสูงคอลัมน์แนวตั้งและการวางตำแหน่งเนื้อหาแท็ก HTML ที่กำหนดและโครงสร้างทั่วไป
  • สไตล์ - คุณสามารถเปลี่ยนสีพื้นหลังได้ที่นี่รวมถึงไฟล์ เอฟเฟกต์โฮเวอร์แม้ เพิ่มรูปภาพหรือวิดีโอ หากคุณต้องการให้เพิ่มเอฟเฟกต์การซ้อนทับเส้นขอบและตัวแบ่งตลอดจนเปลี่ยนการตั้งค่าตัวอักษร
  • avanced - ส่วนนี้ช่วยให้คุณสามารถเพิ่มแอตทริบิวต์ CSS เช่น margin และ z index ภาพเคลื่อนไหว ID และคลาส นอกจากนี้ยังช่วยให้คุณสามารถทำให้ส่วนเหนียวและควบคุมการตั้งค่าตอบสนองรวมทั้งเพิ่มบางส่วน CSS ที่กำหนดเอง.

ทั้งหมดข้างต้นค่อนข้างอธิบายตัวเองได้และคุณจะได้รับสิ่งที่ต้องการอย่างรวดเร็ว

3. ปรับแต่งองค์ประกอบส่วนหัว

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

วิธีปรับแต่งเทมเพลตส่วนหัวขององค์ประกอบธีมเวิร์ดเพรส 8
ในกรณีของโลโก้จะมีตัวเลือกดังต่อไปนี้:

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

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

4. เพิ่มรายการ

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

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

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

ในกรณีเช่นนี้ ให้วางเมาส์เหนือส่วนหัวและใช้เครื่องหมายบวก –+- เพื่อเพิ่มส่วนด้านบน

วิธีปรับแต่งเทมเพลตส่วนหัวขององค์ประกอบธีมเวิร์ดเพรส 10

คลิกที่ปุ่มสีม่วงเพื่อเลือกการออกแบบสามคอลัมน์

วิธีปรับแต่งเทมเพลตส่วนหัวขององค์ประกอบธีมเวิร์ดเพรส 11

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

วิธีปรับแต่งเทมเพลตส่วนหัวขององค์ประกอบธีมเวิร์ดเพรส 12

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

วิธีปรับแต่งเทมเพลตส่วนหัวขององค์ประกอบธีมเวิร์ดเพรส 13

คุณสามารถทำกระบวนการเดียวกันกับองค์ประกอบส่วนหัวอื่น ๆ และแน่นอนกับองค์ประกอบอื่น ๆ ทั้งหมดที่รวมอยู่ใน Elementor

ปรับแต่งเทมเพลตโพสต์ที่ไม่ซ้ำใคร

ใน Elementor คุณยังสามารถปรับแต่งเทมเพลตโพสต์เดียวได้ วิธีการมีดังนี้

1. สร้างโมเดลใหม่

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

วิธีปรับแต่งเทมเพลตส่วนหัวขององค์ประกอบธีมเวิร์ดเพรส 14

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

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

2. กำหนดค่าการแสดงตัวอย่าง

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

วิธีปรับแต่งเทมเพลตส่วนหัวขององค์ประกอบธีมเวิร์ดเพรส 15

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

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

3. มาสร้างส่วนด้านบน 

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

ขั้นตอนแรกคือคลิกที่ป้าย + และสร้างส่วนคอลัมน์เดียว

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

จากนั้นลากวิดเจ็ตชื่อโพสต์ไปยังส่วนใหม่

วิธีปรับแต่งเทมเพลตส่วนหัวขององค์ประกอบธีมเวิร์ดเพรส 18

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

วิธีปรับแต่งเทมเพลตส่วนหัวขององค์ประกอบธีมเวิร์ดเพรส 19

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

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

วิธีปรับแต่งเทมเพลตส่วนหัวขององค์ประกอบธีมเวิร์ดเพรส 20

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

ใต้ชื่อโพสต์เราจะแทรกไฟล์ โพสต์ ข้อมูล วิดเจ็ต เพื่อดูข้อมูลเมตาของโพสต์

วิธีปรับแต่งเทมเพลตส่วนหัวขององค์ประกอบธีมเวิร์ดเพรส 21

นี่คือการตั้งค่าที่ฉันใช้:

วิธีปรับแต่งเทมเพลตส่วนหัวขององค์ประกอบธีมเวิร์ดเพรส 22

นอกจากนี้ฉันใช้ตัวเลือกการจัดแต่งทรงผมเพื่อทำให้การออกแบบพอดีกับส่วนที่เหลือของหน้า ตรวจสอบให้แน่ใจว่าคุณทำเช่นเดียวกัน

4. ตั้งค่าเนื้อหาโพสต์

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

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

วิธีปรับแต่งเทมเพลตส่วนหัวขององค์ประกอบธีมเวิร์ดเพรส 23

โดยพื้นฐานแล้วฉันไม่ได้เปลี่ยนการตั้งค่าใด ๆ เพียงแค่ปล่อยให้ทุกอย่างเป็นอยู่

ถึงเวลาโพสต์เนื้อหาแล้ว ที่นี่คุณมีบล็อกที่เกี่ยวข้องเช่นกัน

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

นอกเหนือจากนั้นนั่นคือทั้งหมด ไม่ต้องทำงานมากเกินไปเพื่อที่เราจะได้ไปยังส่วนสุดท้าย

5. กำหนดค่าส่วนท้าย

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

วิธีปรับแต่งเทมเพลตส่วนหัวขององค์ประกอบธีมเวิร์ดเพรส 25

หลังจากนั้นวางวิดเจ็ต กล่องผู้เขียน ในส่วนด้านซ้าย

วิธีปรับแต่งเทมเพลตส่วนหัวขององค์ประกอบธีมเวิร์ดเพรส 26

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

หลังจากนั้นก็ถึงเวลาเพิ่มบล็อกปุ่มแชร์ทางด้านขวา

วิธีปรับแต่งเทมเพลตส่วนหัวขององค์ประกอบธีมเวิร์ดเพรส 27

คุณสามารถดูการตั้งค่าของฉันในภาพหน้าจอด้านบน

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

วิธีปรับแต่งเทมเพลตส่วนหัวขององค์ประกอบธีมเวิร์ดเพรส 28

(อย่างไรก็ตามหากคุณมีปัญหาในการค้นหาวิดเจ็ตเหล่านี้ให้ใช้ฟังก์ชันการค้นหา)

วิธีปรับแต่งเทมเพลตส่วนหัวขององค์ประกอบธีมเวิร์ดเพรส 29

ทำการปรับเปลี่ยนส่วนความคิดเห็นที่คุณคิดว่าจำเป็น (ฉันปล่อยไว้ตามที่เป็นอยู่) และคุณก็พร้อมที่จะโพสต์ นี่คือการออกแบบที่เสร็จสมบูรณ์:

วิธีปรับแต่งเทมเพลตส่วนหัวขององค์ประกอบธีมเวิร์ดเพรส 30

ปรับแต่งเทมเพลตที่เก็บถาวร

1. กำหนดค่าเทมเพลตเก็บถาวร WordPress ของคุณ

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

วิธีปรับแต่งเทมเพลตส่วนหัวขององค์ประกอบธีมเวิร์ดเพรส 31

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

2. กำหนดชื่อของไฟล์เก็บถาวร

บล็อกแรกที่ฉันต้องการพูดถึงคือชื่อที่เก็บถาวร ชื่อที่เก็บถาวร.

วิธีปรับแต่งเทมเพลตส่วนหัวขององค์ประกอบธีมเวิร์ดเพรส 32

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

วิธีปรับแต่งเทมเพลตส่วนหัวขององค์ประกอบธีมเวิร์ดเพรส 33

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

ตามปกติคุณสามารถดูไฟล์เก็บถาวรต่างๆได้โดยใช้การตั้งค่าการแสดงตัวอย่าง (Eye Symbol> Settings) ด้วยวิธีนี้คุณจะเห็นการออกแบบสำหรับหมวดหมู่แท็กผู้แต่งและอื่น ๆ ที่ไม่ซ้ำใคร โปรดระลึกไว้เสมอ

3. ใช้บล็อกสิ่งพิมพ์ที่เก็บถาวร

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

วิธีปรับแต่งเทมเพลตส่วนหัวขององค์ประกอบธีมเวิร์ดเพรส 34

ลองมาดูตัวเลือกที่ให้คุณปรับแต่งเพจเก็บถาวรของคุณ:

  • ผิว - เลือกแสดงโพสต์ของคุณในรูปแบบคลาสสิกหรือแบบการ์ด
  • คอลัมน์ - กำหนดจำนวนคอลัมน์ที่จะแสดงโพสต์ของคุณ
  • แสดงภาพ - เปิดใช้งานภาพเด่นบนหน้าเก็บถาวร
  • การก่ออิฐ – แสดงรายการเป็นแบบก่ออิฐหรือไม่
  • ขนาดรูปภาพ - ขนาดของรูปภาพ Elementor ควรใช้ในหน้าที่เก็บถาวร
  • ชื่อหนังสือ - คุณต้องการแสดงชื่อโพสต์หรือไม่?
  • แท็ก HTML ชื่อเรื่อง - ถ้าเป็นเช่นนั้นควรใส่แท็ก HTML ใดไว้รอบ ๆ
  • สิ่งที่สกัดมา - รวมข้อความที่ตัดตอนมาจากโพสต์ของคุณหรือแสดงเฉพาะชื่อเรื่อง
  • ความยาวที่ตัดตอนมา - กำหนดความยาวของสารสกัด
  • เมตาดาต้า - กำหนดข้อมูลเมตาของโพสต์ที่มีให้สำหรับผู้เยี่ยมชม
  • ตัวคั่นระหว่าง - สัญลักษณ์ตัวคั่นระหว่างข้อมูลเมตาดาต้า
  • อ่านเพิ่มเติม - รวมลิงก์ "อ่านเพิ่มเติม" ใช่หรือไม่?
  • สัญลักษณ์ - ช่วยให้คุณสามารถเพิ่มข้อมูลเพิ่มเติมในโพสต์เช่นหมวดหมู่และแท็ก
  • ป้าย Taxonomy - คุณสามารถตัดสินใจได้ว่าจะรวมข้อมูลใดไว้ที่นี่
  • รูปโพรไฟล์ – ด้วยสิ่งนี้ คุณสามารถเปลี่ยนรูปโปรไฟล์ของผู้เขียนบทความได้

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

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

4. ควบคุมจำนวนสิ่งพิมพ์ต่อที่เก็บถาวร

บันทึกย่อเกี่ยวกับเทมเพลตการเก็บถาวร ในการเปลี่ยนจำนวนโพสต์ที่ปรากฏในที่เก็บถาวร (หรือในหน้าบล็อกของคุณ) คุณต้องทำใน WordPress ภายใต้ การตั้งค่า> การอ่าน 

วิธีปรับแต่งเทมเพลตส่วนหัวขององค์ประกอบธีมเวิร์ดเพรส 35

ที่นี่เพียงป้อนจำนวนโพสต์ที่คุณต้องการให้ผู้เยี่ยมชมเห็น

ส่วนบุคคล สะดวก ธีม WordPress พร้อม Elementor

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

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

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

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

รับ Elementor Pro ทันที!

สรุป

นั่นไง ! บทความนี้จะแสดงวิธีปรับแต่งธีม WordPress ด้วย Page Builder Elementor สำหรับบทความนี้ หากคุณมีข้อกังวลใด ๆ เกี่ยวกับวิธีการเดินทางไปที่นั่น แจ้งให้เราทราบภายใน ความเห็น.

อย่างไรก็ตามคุณสามารถปรึกษาได้ ทรัพยากรของเราหากคุณต้องการองค์ประกอบเพิ่มเติมเพื่อดำเนินโครงการสร้างเว็บไซต์อินเทอร์เน็ตของคุณโดยปรึกษากับเราใน การสร้างบล็อก WordPress หรือที่อยู่บน Divi: ธีม WordPress ที่ดีที่สุดตลอดกาล.

แต่ในขณะเดียวกัน แบ่งปันบทความนี้ในเครือข่ายโซเชียลต่าง ๆ ของคุณ.

...

0 หุ้น
หุ้น
ทวีต
Enregistrer