Drupal - 主题和布局

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

步骤 1 −转到 Drupal 官方网站，然后单击开始。

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

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

步骤 4 − 接下来，右键单击下载文件并复制链接地址，如以下屏幕所示。

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

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

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

步骤 8 − 如果您已经下载了主题存档，您也可以上传主题存档，而不必复制链接地址，然后单击安装，如以下屏幕所示。

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

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

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

步骤 12 − 单击设置，如以下屏幕所示，设置您网站的外观。

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

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

选择侧边栏位置 − 您可以通过单击单选按钮来选择侧边栏位置。
设置每个侧边栏的宽度 −您可以设置第一个侧边栏和第二个侧边栏的宽度，单位为 % 或 px 或 em。
设置页面宽度 − 您可以设置页面的宽度。
设置最大宽度 −您可以选中或取消选中以设置最大宽度。
此布局的媒体查询 − 媒体查询为不同的媒体设备定义了不同的样式规则，默认情况下此布局为 1025px。

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

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

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

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

步骤 17 −接下来，点击面板和 Gpanels，如以下屏幕所示。自适应主题支持响应式面板和 Gpanel 布局。要使用此功能，您可以使用面板模块、Display Suite(带面板)或自适应主题原生Gpanels布局。