下載適用於大學和學院的免費主頁佈局
已發表: 2017-05-08今天,我們為我們的 Divi 社區提供了另一種免費佈局。 此佈局將幫助想要為大學或學院建立 Divi 網站的人。 將此佈局用作主頁是向當前學生和未來學生展示大學或學院的完美方式。 當然,這也向他們表明,他們正在探索的大學或學院具有很強的時尚感和數字存在感。
大學和學院佈局
在為大學和學院設計網站時,您必須記住一件事: 保持視覺效果。 大學和學院不僅依靠其教育系統的質量來吸引新生,而且還試圖引發情緒。 觸發這種情感投入的一種簡單方法是通過學生最大的需求之一; 社會接觸。
為了展示您在大學或大學中的參與度——並觸發這種情感投入——我們建議您使用真實生活圖片。 選擇您大學或學院教授和學生的高質量照片。 我們對將在本文中與您分享的免費贈品佈局做了同樣的事情。
您可以立即下載的免費主頁佈局如下所示:

訂閱我們的 YouTube 頻道
下載大學和學院佈局
如果您喜歡該佈局並想免費下載它,請繼續並在下面的表格中輸入您的電子郵件。 單擊下載按鈕繼續,您將立即獲得所需的文件。
通過輸入您的電子郵件地址,您將訂閱我們的時事通訊。 您將在我們的網站上獲得有關新的有趣且與 Divi 相關的帖子的信息,並且您將是第一個獲得免費贈品的人。 如果您已經訂閱,請注意輸入您的電子郵件地址不會導致您“重新訂閱”或收到額外的電子郵件。 它只會讓您可以下載。
下載佈局包

免費下載
加入 Divi 時事通訊,我們將通過電子郵件向您發送一份最終的 Divi 登陸頁面佈局包,以及大量其他令人驚嘆的免費 Divi 資源、提示和技巧。 跟隨,您很快就會成為 Divi 大師。 如果您已經訂閱,只需在下面輸入您的電子郵件地址,然後單擊下載即可訪問佈局包。
您已成功訂閱。 請檢查您的電子郵件地址以確認您的訂閱並獲得免費的每週 Divi 佈局包!
ZIP 中有什麼?
下載免費版面時,您將獲得以下文件:
- University-college-master-layout.json – 導入此文件會將完整佈局和所有單獨部分添加到您的 Divi 庫中。
- University-college-full-layout.json – 這只是完整的大學和學院佈局。
- Sections 文件夾– 此文件夾包含大學和學院佈局的七個單獨部分的所有 JSON 文件。
您的大學和學院免費贈品將作為壓縮文件夾顯示在您的下載文件夾中。 我們將在本文的下一部分中為您提供有關如何上傳布局的快速指南。

設置大學和學院佈局
找到下載的壓縮文件夾後,您可以繼續解壓縮。 您會找到上面提到的文件,具體取決於您要使用的部分。 您可以將它們上傳到您的 Divi 庫中。
轉到 Divi > Divi Library > 導入和導出 > 導入 > 選擇大學和學院主文件
繼續向您的網站添加一個新頁面。 通過以下方式激活 Divi Builder 並訪問您頁面上的 Divi 庫:
Divi 圖書館(前端的“+”符號)> 從圖書館添加 > 大學和學院
在為您的頁面選擇大學和學院佈局後,您將看到該佈局將在 Divi Builder 的頁面上彈出。
佈局的目的是用作主頁。 如果您希望人們在直接訪問您的網站時登陸此頁面,請不要忘記在 WordPress 設置中將其設置為首頁。
轉到設置>閱讀>首頁>選擇您最近創建的頁面
使用佈局
佈局有 7 個主要部分,為訪問者提供不同的信息。 我們主要關注藍色,因為它通常與人們心目中的專業精神聯繫在一起。 最重要的是,我們決定在整個頁面中使用“Montserrat”字體系列。 在本文的以下部分,我們將引導您完成不同的部分。
英雄部分

如您所見,此佈局的英雄部分非常乾淨。 我們使用了一個文本模塊和一個按鈕模塊來保持簡單。 我們還為用作該部分背景的圖像添加了分隔線樣式。 看一下代碼; 轉到您部分的自定義 CSS 選項卡並向下滾動到主要元素。 我們創建了一個剪輯路徑,使分隔線樣式看起來像一條曲線。
數字計數器部分

最初,第二部分似乎是英雄部分的一部分。 該效果主要是由在行的第二列中使用的干擾號召性用語模塊創建的。 該模塊看起來像是漂浮在英雄部分上,並將注意力吸引到那裡寫的內容上。 如果您希望行動號召模塊與上一部分分開,請轉到“高級設計設置”選項卡並刪除頂部邊距。
如果您希望行動號召模塊與上一部分分開,請轉到“高級設計設置”選項卡並刪除頂部邊距。
介紹部分

對於本節,我們希望保持曲線繼續運行,因此我們也在本節的頂部製作了一個。 通過這樣做,我們在不同的部分之間創建了一個連接,它看起來也很好。
研究領域部分

在研究領域部分,我們決定使用與數字計數器部分相同的浮動效果。 這讓訪問者認為所提到的研究領域之一是特殊的。 您可以隨時更改該研究領域,具體取決於您當時的目標受眾。
如果您目前正在開展各種營銷活動來吸引醫學研究領域的學生,請選擇在同一時期突出該研究領域。 我們還添加了一個額外的強調箭頭,它隱藏在手機和平板電腦上。
我們在本節中沒有使用 Blurb 模塊,因為我們希望有專門針對研究領域的圖像。 對於此佈局中的圖標,我們使用了新的 AutoDraw 工具,並在 Photoshop 中使用魔術棒工具將它們製作成透明的 PNG 圖像。 如果您不想浪費太多時間尋找要下載的圖標,但又知道它們提供的圖形是有限的,那麼使用 AutoDraw 是一種簡單的方法。
如果您不想浪費太多時間尋找要下載的圖標,但又知道它們提供的圖形是有限的,那麼使用 AutoDraw 是一種簡單的方法。
學生組

有兩種方法可以將學生的故事展示出來; 通過使用推薦模塊或人員模塊。 在這種情況下,我們選擇了人物模塊以確保主要焦點在圖像上。 就像我之前說過的; 人們選擇某一所大學或學院不僅是為了自己的學習領域,而且是為了他人的社會交往和經歷。 我們是視覺動物,所以我們喜歡將推薦、陳述和文字與一張臉聯繫起來。 它使人們更容易信任和相信大學或學院的質量。
聯繫表格部分

我們在整個網站上使用了足夠多的圖片,這就是我們決定保持聯繫表格簡潔明了的原因。
頁腳
頁腳也很乾淨。 我們在本節中使用了較深的背景顏色來強調大學或學院應該表達的嚴肅性。 我們已經提供了網站訪問者可能需要的所有實用信息,例如社交媒體渠道的按鈕、地址、電話號碼和電子郵件地址。

包起來
我們希望我們社區的所有成員都可以輕鬆地開始為具有這種佈局的大學和學院構建網站——無論是為他們自己還是他們的客戶。 我們建議在網站的其他頁面中使用相同的樣式、字體系列和顏色。
歡迎在下面的評論部分提出任何意見或問題。 我會隨時待命,我會盡我所能回答你所有的問題。 最重要的是,如果您對 Divi 的教程有任何建議,請拍攝!
如果您渴望了解有關 Divi 的更多信息並獲得更多 Divi 免費贈品,請確保訂閱我們的電子郵件時事通訊和 YouTube 頻道,這樣您將永遠是第一批了解此免費內容並從中受益的人之一。
