คู่มือการใช้แถบด้านข้างกับตัวสร้างธีม Divi
เผยแพร่แล้ว: 2019-11-14แถบด้านข้างสามารถเป็นทรัพยากรที่สำคัญสำหรับเว็บไซต์ใดๆ Divi อำนวยความสะดวกในการสร้างแถบด้านข้างโดยให้นักพัฒนามีอำนาจในการออกแบบแถบด้านข้างที่กำหนดเองอย่างสมบูรณ์สำหรับเทมเพลตโพสต์หรือหน้าโดยใช้ Divi Theme Builder เมื่อผู้ใช้ Divi เลือกโครงสร้างคอลัมน์ที่มีพื้นที่แถบด้านข้างที่ต้องการ พวกเขามีตัวเลือกในการสร้างเนื้อหาแถบด้านข้างโดยใช้พื้นที่วิดเจ็ต WordPress, โมดูล Divi หรือทั้งสองอย่างรวมกันเพื่อสร้างเนื้อหาแถบด้านข้างด้วยโมดูล Divi หรือทั้งสองอย่าง!
ในโพสต์นี้ เราจะให้คำแนะนำโดยย่อเกี่ยวกับวิธีใช้แถบด้านข้างกับ Divi Theme Builder เราจะครอบคลุมถึงวิธีการสร้างพื้นที่แถบด้านข้างอย่างถูกต้องสำหรับแม่แบบของคุณ ตลอดจนวิธีการเติมเนื้อหาในแถบด้านข้าง ซึ่งจะช่วยให้คุณสามารถรวมแถบด้านข้างที่มีอยู่เข้ากับเทมเพลต Divi ใหม่ รวมทั้งสร้างแถบด้านข้างใหม่สำหรับเทมเพลตจำนวนเท่าใดก็ได้ทั่วทั้งเว็บไซต์ของคุณ
ไปกันเถอะ!
สมัครสมาชิกช่อง Youtube ของเรา
คำสั้นๆ เกี่ยวกับการใช้แถบด้านข้างกับเทมเพลต Divi
คุณสามารถเพิ่มแถบด้านข้างให้กับโพสต์หรือเทมเพลตหน้าบนเว็บไซต์ของคุณโดยใช้ Divi Theme Builder กระบวนการนี้เหมือนกับการสร้างแถบด้านข้างสำหรับเค้าโครงหน้าเฉพาะโดยใช้ Divi Builder ข้อแตกต่างเพียงอย่างเดียวคือแถบด้านข้างที่เพิ่มลงในเทมเพลตจะแสดงในโพสต์หรือหน้าทั้งหมดที่กำหนดให้กับเทมเพลต สิ่งนี้ช่วยให้คุณควบคุมแถบด้านข้างได้ทั่วทั้งเว็บไซต์ของคุณ
WordPress Sidebars vs. Divi Sidebars
แถบด้านข้างของ WordPress เป็นเทมเพลตเริ่มต้นของธีม Divi แถบด้านข้างเหล่านี้จะแสดงสำหรับหน้าหรือโพสต์ที่มีเค้าโครงที่มีแถบด้านข้างและไม่ได้ใช้ Divi Builder เพื่อออกแบบหน้า

Divi Sidebars ถูกสร้างขึ้นภายใน Divi Builder และสามารถเติมเนื้อหาโดยใช้โมดูล Divi รวมถึงวิดเจ็ต WordPress ผ่านโมดูลแถบด้านข้าง

วิธีสร้างพื้นที่แถบด้านข้างสำหรับเทมเพลตของคุณ
ขั้นตอนการสร้างแถบด้านข้างสำหรับเทมเพลตของคุณนั้นค่อนข้างง่าย
ขั้นแรก คุณต้องเพิ่ม Custom Body ให้กับเทมเพลตที่คุณกำลังสร้าง


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

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

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

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

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

วิธีเพิ่มเนื้อหาแถบด้านข้างให้กับเทมเพลตของคุณ
มีสองวิธีหลักในการเพิ่มเนื้อหาแถบด้านข้างให้กับแม่แบบของคุณ อย่างแรกคือการเพิ่ม WordPress Widget Areas ให้กับ Divi Template ประการที่สองคือการเพิ่มโมดูล Divi และเนื้อหาแบบไดนามิกไปยังแถบด้านข้างโดยตรงในตัวแก้ไขเค้าโครงแม่แบบ อย่างไรก็ตาม หากต้องการ คุณสามารถสร้างทั้งสองส่วนรวมกันได้โดยเพิ่มพื้นที่วิดเจ็ตและโมดูล Divi หลายส่วนในแถบด้านข้างเดียว
การเพิ่มพื้นที่วิดเจ็ต WordPress
WordPress (และ Divi) ใช้พื้นที่วิดเจ็ตเพื่อเติมแถบด้านข้างตามค่าเริ่มต้นแล้ว พื้นที่วิดเจ็ตสามารถพบได้โดยไปที่ WordPress Dashboard และไปที่ Appearance > Widgets คุณจะเห็นพื้นที่วิดเจ็ตแถบด้านข้างเริ่มต้นที่มีวิดเจ็ตอยู่แล้ว


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

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

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

ประโยชน์ของการใช้พื้นที่วิดเจ็ต WordPress สำหรับเนื้อหาแถบด้านข้าง
มีประโยชน์บางประการของการใช้ WordPress Widget Areas สำหรับเนื้อหาในแถบด้านข้าง ต่อไปนี้คือบางส่วนที่อยู่ในใจ:
- คุณสามารถใช้แถบด้านข้างของ WordPress ที่มีอยู่ (ไม่ได้สร้างด้วย Divi) บนเทมเพลต Divi ใหม่ ดังนั้น หากคุณมีบล็อกที่ใช้แถบด้านข้างเริ่มต้น คุณไม่ต้องกังวลกับการสร้างแถบด้านข้างใหม่ตั้งแต่ต้นเมื่อสร้างเทมเพลตใหม่ใน Divi Theme Builder
- แสดงแถบด้านข้างของ WordPress แบบคู่โดยใช้ Theme Builder ด้วยตัวเลือกเลย์เอาต์ที่หลากหลายของ Divi สำหรับส่วนปกติและส่วนพิเศษ คุณสามารถกำหนดมากกว่าหนึ่งคอลัมน์เพื่อรวมแถบด้านข้าง คุณยังสามารถสร้างพื้นที่วิดเจ็ตเพิ่มเติมสำหรับแถบด้านข้างแต่ละแถบ และเพิ่มพื้นที่เหล่านั้นโดยใช้โมดูลแถบด้านข้าง
- คุณสามารถจัดสไตล์ WordPress Sidebars/widget Areas ด้วย Divi Theme Builder หากคุณไม่ต้องการพึ่งพา CSS ภายนอกในการจัดรูปแบบเมนู WordPress เริ่มต้นของคุณ คุณสามารถเพิ่มลงในเค้าโครงเทมเพลตโดยใช้โมดูลตัวเลื่อน และใช้การตั้งค่าโมดูลตัวเลื่อนเพื่อจัดรูปแบบพื้นที่วิดเจ็ต
- ใช้วิดเจ็ตเพื่อเพิ่มเนื้อหาในแถบด้านข้างของคุณที่ไม่มีใน Divi Modules ในบางครั้ง คุณสามารถใช้วิดเจ็ตเพื่อเพิ่มเนื้อหาลงในแถบด้านข้างในแบบที่คุณไม่สามารถทำได้โดยใช้ Divi Modules โดยเฉพาะอย่างยิ่งหากคุณใช้ปลั๊กอินของบุคคลที่สามซึ่งมีวิดเจ็ตที่กำหนดเอง
การเพิ่มโมดูล Divi เป็นเนื้อหาแถบด้านข้าง
แน่นอน คุณไม่ได้จำกัดอยู่แค่การใช้โมดูลแถบด้านข้างเพื่อแสดงเนื้อหาในแถบด้านข้าง คุณมีพลังเต็มที่ของโมดูล Divi ในการสร้างเนื้อหาประเภทใดก็ได้ที่คุณต้องการ เพียงไปที่คอลัมน์แถบด้านข้างที่กำหนดและเพิ่มโมดูลใหม่

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

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

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

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

จากนั้นสร้างแถบด้านข้างที่มีเนื้อหาเกี่ยวกับร้านค้าของคุณโดยเฉพาะสำหรับเทมเพลต "ผลิตภัณฑ์ทั้งหมด"

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