ดาวน์โหลดเค้าโครงหน้าแรกฟรีสำหรับมหาวิทยาลัยและวิทยาลัย
เผยแพร่แล้ว: 2017-05-08วันนี้ เรากำลังให้ชุมชน Divi ของเรามีเค้าโครงฟรีอีกแบบหนึ่ง เลย์เอาต์นี้จะช่วยผู้ที่ต้องการตั้งค่าเว็บไซต์ Divi สำหรับมหาวิทยาลัยหรือวิทยาลัย การใช้เลย์เอาต์นี้เป็นโฮมเพจของคุณเป็นวิธีที่สมบูรณ์แบบในการแสดงให้นักเรียนปัจจุบัน และ นักเรียนในอนาคตเห็นว่ามหาวิทยาลัยหรือวิทยาลัยเกี่ยวกับอะไร และแน่นอน มันยังแสดงให้พวกเขาเห็นว่ามหาวิทยาลัยหรือวิทยาลัยที่พวกเขากำลังสำรวจมีสไตล์และตัวตนทางดิจิทัลที่ยอดเยี่ยม
เค้าโครงมหาวิทยาลัยและวิทยาลัย
เมื่อออกแบบเว็บไซต์สำหรับมหาวิทยาลัยและวิทยาลัย มีสิ่งหนึ่งที่คุณต้องจำไว้ เก็บไว้เป็นภาพ มหาวิทยาลัยและวิทยาลัยไม่เพียงแต่พึ่งพาคุณภาพของระบบการศึกษาเพื่อดึงดูดนักศึกษาใหม่เท่านั้น แต่ยังพยายามกระตุ้นอารมณ์อีกด้วย วิธีง่ายๆ ในการกระตุ้นให้เกิดการมีส่วนร่วมทางอารมณ์คือความต้องการที่ใหญ่ที่สุดอย่างหนึ่งของนักเรียน การติดต่อทางสังคม
เพื่อแสดงการมีส่วนร่วมที่คุณมีในวิทยาลัยหรือมหาวิทยาลัยของคุณ และเพื่อกระตุ้นการมีส่วนร่วมทางอารมณ์นั้น เราขอแนะนำให้คุณใช้รูปภาพในชีวิตจริง เลือกรูปภาพคุณภาพสูงของอาจารย์และนักศึกษาในมหาวิทยาลัยหรือวิทยาลัยของคุณ เราทำสิ่งเดียวกันสำหรับเลย์เอาต์ของแจกฟรีที่เราจะแชร์กับคุณในโพสต์นี้
เค้าโครงหน้าแรกฟรีที่คุณสามารถดาวน์โหลดได้ทันทีมีลักษณะดังนี้:

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

ดาวน์โหลดฟรี
เข้าร่วมจดหมายข่าว Divi แล้วเราจะส่งอีเมลสำเนาชุดเค้าโครงหน้า Landing Page ของ Divi ที่ดีที่สุดให้คุณ พร้อมแหล่งข้อมูล เคล็ดลับ และลูกเล่นที่น่าตื่นตาตื่นใจและฟรีอีกมากมายของ Divi ทำตามแล้วคุณจะเป็นผู้เชี่ยวชาญ Divi ในเวลาไม่นาน หากคุณสมัครรับข้อมูลแล้ว เพียงพิมพ์ที่อยู่อีเมลของคุณด้านล่างแล้วคลิกดาวน์โหลดเพื่อเข้าถึงชุดเค้าโครง
คุณสมัครสำเร็จแล้ว โปรดตรวจสอบที่อยู่อีเมลของคุณเพื่อยืนยันการสมัครของคุณและเข้าถึงชุดเค้าโครง Divi รายสัปดาห์ฟรี!
มีอะไรอยู่ใน ZIP?
คุณจะได้รับไฟล์ต่อไปนี้เมื่อดาวน์โหลดเค้าโครงฟรี:
- university-college-master-layout.json – การนำเข้าไฟล์นี้จะเพิ่มเลย์เอาต์แบบเต็มและทุกส่วนไปยังไลบรารี Divi ของคุณ
- university-college-full-layout.json – นี่เป็นเพียงเลย์เอาต์ของมหาวิทยาลัยและวิทยาลัยแบบเต็ม
- โฟลเดอร์ส่วน – โฟลเดอร์นี้ประกอบด้วยไฟล์ JSON ทั้งหมดสำหรับเจ็ดส่วนแต่ละส่วนของเค้าโครงมหาวิทยาลัยและวิทยาลัย
ของแจกฟรีสำหรับมหาวิทยาลัยและวิทยาลัยของคุณจะปรากฏในโฟลเดอร์ดาวน์โหลดของคุณเป็นโฟลเดอร์ซิป เราจะให้คำแนะนำโดยย่อเกี่ยวกับวิธีการอัปโหลดเลย์เอาต์ในส่วนถัดไปของโพสต์นี้
การตั้งค่าเค้าโครงมหาวิทยาลัยและวิทยาลัย
เมื่อคุณพบโฟลเดอร์ซิปที่ดาวน์โหลดแล้ว คุณสามารถเปิดเครื่องรูดได้เลย คุณจะพบไฟล์ที่กล่าวถึงข้างต้นและขึ้นอยู่กับส่วนที่คุณต้องการใช้ คุณสามารถอัปโหลดลงในห้องสมุด Divi ของคุณ
ไปที่ Divi > Divi Library > Import & Export > Import > Select the University & College master file
ดำเนินการต่อโดยเพิ่มหน้าใหม่ในเว็บไซต์ของคุณ เปิดใช้งาน Divi Builder และเข้าถึง Divi Library บนเพจของคุณโดยไปที่:

ห้องสมุด Divi (สัญลักษณ์ “+” ที่ส่วนหน้า) > เพิ่มจากห้องสมุด > มหาวิทยาลัยและวิทยาลัย
หลังจากเลือกเลย์เอาต์ของมหาวิทยาลัยและวิทยาลัยสำหรับเพจของคุณแล้ว คุณจะเห็นว่าเลย์เอาต์นั้นจะปรากฏขึ้นบนเพจใน Divi Builder
จุดประสงค์ของเลย์เอาต์คือเพื่อใช้เป็นโฮมเพจ หากคุณต้องการให้ผู้คนมาที่หน้านี้เมื่อเข้าชมเว็บไซต์ของคุณโดยตรง อย่าลืมตั้งเป็นหน้าแรกของคุณในการตั้งค่า WordPress
ไปที่ การตั้งค่า > การอ่าน > หน้าแรก > เลือกเพจที่คุณเพิ่งสร้างขึ้น
การใช้เค้าโครง
เลย์เอาต์มี 7 ส่วนหลักที่ให้ข้อมูลต่างๆ แก่ผู้เข้าชม เราเน้นสีน้ำเงินเป็นหลักเพราะมักจะเชื่อมโยงกับความเป็นมืออาชีพในใจของผู้คน ยิ่งไปกว่านั้น เราตัดสินใจเลือกใช้ฟอนต์ตระกูล 'Montserrat' ตลอดทั้งหน้า ในส่วนต่อไปนี้ของโพสต์นี้ เราจะแนะนำส่วนต่างๆ ให้คุณทราบ
หมวดฮีโร่

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

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

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

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

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

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

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