จัดโครงสร้างและปรับแต่งเค้าโครงเทมเพลต
อัปเดตล่าสุด: กุมภาพันธ์ 13, 2025
สามารถใช้ได้กับการสมัครใช้บริการใดๆ ต่อไปนี้ ยกเว้นที่ระบุไว้:
|
|
Marketing Hub Basic เดิม |
เรียนรู้วิธีตั้งค่าและปรับแต่งเทมเพลตการลากและวางที่มีอยู่และทำงานร่วมกับโมดูลกลุ่มและคอลัมน์เป็นบล็อกการสร้างเทมเพลตของคุณ
โครงสร้างเทมเพลตของคุณ
ด้วยการใช้ตัวแก้ไขเค้าโครงในตัวจัดการการออกแบบคุณสามารถสร้างเค้าโครงเนื้อหาของคุณได้อย่างรวดเร็วโดยไม่ต้องเขียน HTML ใดๆ
- ในบัญชี HubSpot ของคุณ ไปที่ เนื้อหา > ตัวจัดการการออกแบบ
- ในตัวค้นหาให้คลิกเทมเพลตเพื่อแก้ไข
เพิ่มและลากโมดูล
หากต้องการเพิ่มโมดูลลงในเค้าโครงให้คลิก + เพิ่มที่ด้านบนของตัวตรวจสอบเค้าโครง ค้นหาหรือเลือก โมดูลจากนั้นลากไปยังตำแหน่งที่คุณต้องการให้โมดูลแสดงในเค้าโครง การลากโมดูลที่ด้านบนของโมดูลอื่นๆจะสร้างคอลัมน์หรือจัดกลุ่มโมดูล
เปลี่ยนความกว้างของคอลัมน์
หากต้องการเปลี่ยนความกว้างของคอลัมน์ให้เลื่อนเมาส์ไปมาระหว่างโมดูลและคลิกและลากในแนวนอน
โมดูลกลุ่ม
กลุ่มโมดูลเป็นหน่วยของโมดูลที่ประกอบขึ้นเป็นส่วนต่างๆของหน้า
ในการจัดกลุ่มสองโมดูลให้คลิกโมดูลแรกจากนั้นกดปุ่ม Control/Command ค้างไว้และเลือกโมดูลที่สอง ทำซ้ำขั้นตอนนี้หากคุณกำลังจัดกลุ่มโมดูลมากกว่าสองโมดูล จากนั้นคลิกกลุ่มไอคอนกลุ่ม groupModuleดูลในตัวตรวจสอบโมดูล
โปรดทราบ: กลุ่มโมดูลไม่สามารถข้ามตัวแยกส่วนหรือมีกลุ่มโมดูลที่เลือกบางส่วน
แยกโมดูลในแนวนอน
การแยกโมดูลแบ่งครึ่งโมดูลสร้างสองโมดูล หากต้องการแยกโมดูลให้คลิกโมดูลจากนั้นคลิกไอคอนแยกโมดูลแยกโม splitModuleดูลในตัวตรวจสอบโมดูล หรือคุณสามารถคลิกขวาที่โมดูลในเลย์เอาต์และเลือกโมดูลแยก
โมดูลกลาง
ด้วยตัวเว้นวรรคแนวนอนคุณสามารถจัดโมดูลและกลุ่มให้อยู่ตรงกลางบนหน้าเว็บหรือเพิ่มพื้นที่ว่างที่ด้านใดด้านหนึ่งของโมดูลได้ หากต้องการเพิ่มตัวเว้นวรรคแนวนอนให้คลิก + เพิ่มที่ด้านบนของตัวตรวจสอบเค้าโครง ค้นหาตัวเว้นระยะแนวนอนจากนั้นลากและวางลงในเทมเพลต
หากต้องการเปลี่ยนขนาดของตัวเว้นวรรคแนวนอนให้เปลี่ยนความกว้างของคอลัมน์ที่แยกออกจากโมดูลอื่นๆ ในการจัดกึ่งกลางโมดูลหรือกลุ่มให้เพิ่มตัวเว้นวรรคแนวนอนในแต่ละด้าน
เพิ่มคอลัมน์ยืดหยุ่น
คอลัมน์แบบยืดหยุ่นได้รับการออกแบบมาเพื่อให้การจัดการเนื้อหาในระดับหน้าง่ายขึ้นสำหรับผู้สร้างเนื้อหา เมื่อเพิ่มคอลัมน์ที่ยืดหยุ่นลงในเทมเพลตเพจ HubSpot ผู้ใช้จะได้รับตัวเลือกในการเพิ่มลบและสั่งซื้อโมดูลใหม่ภายในตัวแก้ไขเพจแต่ละตัว ฟีเจอร์นี้ช่วยให้นักออกแบบสามารถสร้างเทมเพลตได้น้อยลงในขณะที่ยังช่วยให้นักการตลาดมีความยืดหยุ่นในการปรับแต่งแต่ละหน้าให้เหมาะกับความต้องการของพวกเขา
หากต้องการเพิ่มคอลัมน์ที่ยืดหยุ่นให้คลิก + เพิ่มที่ด้านบนของตัวตรวจสอบเค้าโครง ค้นหาคอลัมน์ยืดหยุ่นจากนั้นลากและวางลงในเทมเพลต
- สามารถเพิ่มคอลัมน์ที่ยืดหยุ่นลงในเทมเพลตหน้าเท่านั้นและไม่สามารถเพิ่มลงในเทมเพลตอีเมลหรือบล็อกได้
- โมดูลที่เพิ่มลงในคอลัมน์ยืดหยุ่นไม่สามารถมีคลาส CSS การจัดแต่งทรงผมแบบอินไลน์หรือการตัด HTML ที่เชื่อมโยงกับโมดูลได้ ต้องเพิ่มตัวเลือกการจัดแต่งทรงผมลงในคอลัมน์ที่ยืดหยุ่น
ปรับแต่งเทมเพลตของคุณ
เมื่อคุณจัดโครงสร้างเค้าโครงทั่วไปของเทมเพลตของคุณแล้วคุณสามารถสลับโมดูลและทำการปรับแต่งเทมเพลตอื่นๆได้
แก้ไขตัวเลือกโมดูล
คุณสามารถแก้ไขตัวเลือกของโมดูลได้โดยคลิกที่โมดูลในตัวแก้ไขเค้าโครง ในตัวตรวจสอบโมดูลด้านขวาคุณจะเห็นตัวเลือกที่แก้ไขได้ของโมดูล ตัวเลือกเหล่านี้โดยทั่วไปจะรวมถึงการจัดแต่งทรงผมเนื้อหาเริ่มต้นและตัวเลือกตัวแก้ไขและอาจแตกต่างกันไปขึ้นอยู่กับประเภทของโมดูลที่เฉพาะเจาะจง ดูข้อมูลเพิ่มเติมเกี่ยวกับ CSS ของโมดูลการแก้ไขและเนื้อหาและการตั้งค่าเริ่มต้น
โมดูลสลับ
หลังจากเพิ่มโมดูลลงในเทมเพลตแล้วคุณสามารถเลือกเปลี่ยนเป็นโมดูลอื่นได้ คลิกขวาที่โมดูลในตัวแก้ไขเค้าโครงจากนั้นคลิกสลับโมดูล ในเมนูแบบเลื่อนลงที่ปรากฏขึ้นให้เลือกโมดูลเพื่อแทนที่โมดูลดั้งเดิมด้วย
แปลงเป็นโมดูลส่วนรวม
คุณสามารถแปลงโมดูลในเทมเพลตของคุณเป็นโมดูลทั่วโลกซึ่งสามารถใช้ได้ในหลายเทมเพลต สิ่งนี้จะมีประโยชน์เมื่อคุณจัดรูปแบบโมดูลในลักษณะใดลักษณะหนึ่งและ/หรือมีเนื้อหาเริ่มต้นในโมดูลที่คุณต้องการนำกลับมาใช้ใหม่ในเทมเพลตอื่นๆ
- คลิกโมดูลในตัวแก้ไขเค้าโครง
- ในตัวตรวจสอบโมดูลให้คลิกเมนูแบบเลื่อนลงเพิ่มเติมและเลือกแปลงเป็นโมดูลทั่วโลก
- ในกล่องโต้ตอบให้ป้อนชื่อโมดูลส่วนรวมจากนั้นคลิก สร้าง
ลบโมดูล
หากต้องการลบโมดูลให้คลิกโมดูลในตัวแก้ไขเค้าโครงจากนั้นคลิกไอคอนถังขยะ deleteในตัวตรวจสอบโมดูล หรือคุณสามารถคลิกขวาที่โมดูลและเลือกลบโมดูล
จัดการเทมเพลตของคุณในตัวค้นหา
นอกเหนือจากตัวเลือกโมดูลของคุณแล้วยังมีการดำเนินการหลายอย่างที่คุณสามารถทำได้โดยเฉพาะกับเทมเพลตของคุณ
- ที่ด้านขวาบนของเทมเพลตให้คลิกโฟลเดอร์โฟลเดfolder
- คลิกขวาที่ชื่อของเทมเพลต ในเมนูแบบเลื่อนลงคุณสามารถปรับแต่งตัวเลือกต่อไปนี้:
- คัดลอกไปยังพอร์ทัล: คัดลอกเทมเพลตไปยังพอร์ทัลอื่นที่คุณเป็นผู้ใช้ด้วย เทมเพลตที่ซื้อจาก Marketplace จะไม่สามารถคัดลอกไปยังพอร์ทัลอื่นๆได้
- เทมเพลตโคลน: สิ่งนี้จะสร้างเทมเพลตที่ซ้ำกันและมีประโยชน์เมื่อคุณต้องการสร้างรูปแบบของเทมเพลตที่มีอยู่
- โคลนไปที่ HTML: นี่เป็นการสร้างเทมเพลต HTML แยกต่างหาก ซึ่งจะเป็นประโยชน์หากคุณต้องการควบคุมมาร์กอัปมากขึ้นหรือต้องการเรียนรู้เพิ่มเติมเกี่ยวกับวิธีเขียนโค้ดเทมเพลต
- ดูแหล่งที่มาของเทมเพลต: ดู HTML ของซอร์สโค้ดของเทมเพลต ซึ่งแตกต่างจากตัวเลือก Clone to HTML ซึ่งจะไม่สร้างเทมเพลต HTML แยกต่างหาก
- เปลี่ยนชื่อเทมเพลต: แก้ไขชื่อภายในเทมเพลตของคุณ
- แสดงผู้อยู่ในอุปการะ: ดูหน้าเว็บอีเมลหรือบล็อกทั้งหมดที่กำลังใช้เทมเพลต
- แสดงประวัติการแก้ไข: ดูประวัติการแก้ไขของเทมเพลตของคุณและเลือกที่จะเปลี่ยนเทมเพลตของคุณกลับเป็นเวอร์ชันที่เผยแพร่ก่อนหน้านี้
- สร้างอีเมล/เพจ: สร้างอีเมลหรือแลนดิ้งเพจ/หน้าเว็บไซต์โดยตรงจากเทมเพลต
- ลบเทมเพลต: สิ่งนี้จะลบเทมเพลต เมื่อลบแล้วเทมเพลตจะยังคงใช้งานได้เป็นเวลา 30 วันหลังจากนั้นเทมเพลตจะถูกลบอย่างถาวร หากต้องการกู้คืนเทมเพลตคุณจะต้องติดต่อฝ่ายสนับสนุนลูกค้า
- ตัวเลือกเหล่านี้ยังสามารถเข้าถึงได้จากเมนูแบบ เลื่อนลง ไฟล์และการกระทำด้านบน