下载适用于大学和学院的免费主页布局
已发表: 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 频道，这样您将永远是第一批了解此免费内容并从中受益的人之一。