Drupal - 主题和布局

---

在本章中，让我们学习主题和布局。Drupal 在安装过程中将安装Bartik主题作为默认主题。您可以从 Drupal 官方网站选择付费或免费主题。一般来说，布局是文本和图形的排列。选择主题是一个好主意，请记住在您的网站上使用哪些不同的布局。

步骤 1 - 转到Drupal 官方网站并单击“开始”。

步骤 2 - 单击“所有主题”，如以下屏幕所示。

步骤 3 - 您将获得主题列表。选择您选择的主题（让我们选择自适应主题，因为它包含布局和常规设置，这将在本章后面介绍），然后单击版本，如以下屏幕所示。

步骤 4 - 接下来，右键单击“下载文件”并复制链接地址，如下图所示。

步骤 5 - 您还可以通过单击存档文件直接下载主题，该模块将下载到您的计算机本地，如以下屏幕所示。

步骤 6 - 转到外观并单击安装新主题，如以下屏幕所示。

步骤 7 - 您可以粘贴在步骤 (4)中复制的链接地址，然后单击安装按钮，如以下屏幕所示。

步骤 8 - 如果您已下载主题存档并单击“安装”，则也可以上传主题存档，而不是复制链接地址，如下图所示。

步骤 9 - 出现以下屏幕，等待安装完成。

步骤 10 - 接下来，单击启用新添加的主题，如以下屏幕所示。

步骤 11 - 默认情况下主题被禁用。要启用它们，请单击启用并设置默认值，如以下屏幕所示。

步骤 12 - 单击“设置”（如以下屏幕所示）以设置站点的外观。

步骤 13 -屏幕上弹出布局和常规设置选项，在此自适应主题中包含标准布局、平板电脑布局、Smalltouch 布局和面板和 Gpanels。这些选项控制已使用的当前 AT 管理主题的显示设置。当您的网站显示主题时，将使用这些设置。现在，让我们一一讨论这些布局。

步骤 14 - 在标准布局中，您可以选择台式机、笔记本电脑和其他大屏幕设备的布局。

• 选择侧边栏位置- 您可以通过单击单选按钮来选择侧边栏位置。

• 设置每个侧边栏的宽度- 您可以设置第一个侧边栏和第二个侧边栏的宽度以及单位为％或px或em。

• 设置页面宽度- 您可以设置页面的宽度。

• 设置最大宽度- 您可以选中或取消选中以设置最大宽度。

• 此布局的媒体查询- 媒体查询为不同的媒体设备定义不同的样式规则，默认情况下此布局将为1025px。

步骤 15 - 接下来，单击平板电脑布局，如以下屏幕所示。平板电脑设备将有两种方向：横向和纵向。您可以为每个方向配置不同的布局。

在横向平板电脑和纵向平板电脑下，您可以选择侧边栏位置、每个侧边栏的宽度和页面宽度。横向平板电脑的媒体查询将为 min-width:769px 和 max-width:1024px。对于纵向平板电脑，最小宽度为：581px，最大宽度：768px

步骤 16 - 现在，单击Smalltouch 布局，如以下屏幕所示。Smalltouch 布局也将有两种方向：横向和纵向。您可以为每个方向配置不同的布局。

在横向 Smalltouch中，您可以选择侧边栏位置并设置宽度。Portrait Smalltouch始终显示在一列中，侧边栏水平堆叠在主要内容下方。Landscape Smalltouch的媒体查询将为 min-width:321px 和 max-width:580px，而Portrait Smalltouch 的媒体查询将为 max-width:320px。

步骤 17 - 接下来，单击面板和面板，如以下屏幕所示。自适应主题支持响应式面板和 Gpanel 布局。要使用此功能，您可以使用面板模块、显示套件（带面板）或自适应主题原生Gpanels布局。

您可以为每个设备范围选择选项并布局其类型。让我们一一看看。

• 在标准布局下，您可以选择以标准布局查看站点时要使用的布局。通过单击“二”、“三”、“四”、“五”、“六”或“插入”，您可以选择列排列，如下图所示。

• 对于“平板电脑横向”、“平板电脑纵向”和“SMALLTOUCH 横向”布局，请执行相同的步骤。

步骤 18 - 完成所有配置后，单击保存配置，如以下屏幕所示。