使用 Astra 免费主题设置全宽或盒装内容

阿斯特拉主题

Astra 是一个高效且完全可定制的 WordPress 主题。 它既美观又快速,这使其成为博客、商业、个人作品集和 WooCommerce 店面的理想选择。 由于重量轻,它为网站提供了很高的速度。 Astra 在构建时考虑了 SEO,这使得网站在搜索引擎中排名更高。 凭借其特殊的功能和模板,它非常适合 Elementor、Divi、Beaver Builder、SiteOrigin、Visual Composer 等页面构建器。

容器

网站上的页面可以方便地称为容器,因为容器是我们显示内容的区域。 简单地说,容器包含了整个页面。 无论是内容区域还是侧边栏,都会包含在容器中。 从技术上讲,我们将内容区域称为主容器,而侧边栏则称为辅助容器。

如何操纵网站上的容器布局?

使用 Astra 主题可以方便地在整个网站上应用容器布局。 您可以通过定制器选项设置网格。 这可以在“外观”选项卡中找到:“外观”>“定制器”>“全局”>“容器”。

  • 您还可以通过元设置为不同的页面和帖子单独应用不同的容器。
  • 如果您对整个网站应用了不同的设置,并在元设置,则特定于页面的元设置将比整个页面定制器设置具有更高的优先级。

集装箱宽度

所有网站内容,无论是图形还是文本,都将在此宽度内显示。 您可以通过将宽度与容器布局相结合来创建各种视图。

1.png

集装箱布局

Astra 免费主题提供 4 种类型的容器布局。 这些是全局布局,将应用于整个网站。 如果您想要针对不同的帖子类型使用不同的布局,您可以使用专用的容器布局来实现。

借助页面“元设置”,您可以更好地控制每个页面的容器布局。

容器布局有以下类型。

  • 盒装
  • 盒装内容
  • 全宽/包含
  • 全宽/拉伸
  • 专用容器布局

专用或特定布局

上面给出的四种类型的容器布局分别适用于特定的帖子类型。 这意味着,如果您选择默认布局(假设为盒装布局),并且对于档案您选择了全宽,则整个网站将具有盒装布局,而档案页面将具有全宽/包含布局。

  • 页面布局 – 仅适用于页面
  • 档案布局 – 所有档案
  • 博客文章布局 – 用于博客存档和单个博客文章页面
2.png

Astra 主题提供了与许多流行plugin集成。 这些plugin提供与 Astra 的集成:

WooCommerce

EDD(Easy Digital Downloads)

学习达世币

升降机LMS (3)

安装上述plugin后,您也可以访问这些plugin页面的专用容器布局选项。

Astra Pro Addonplugin的专用模块提供了更高级的选项。 Astra Pro Addonplugin的专用模块包含以下选项:

  • 页面元设置优先于容器布局。 元设置的优先级高于定制器设置。
  • 站点布局设置决定容器的宽度。

容器布局/全宽布局

Docs中的定制器设置来操作全角容器设置。

文档 » 定制器设置 » 全局 » 全宽/包含 – 容器布局

如前所述,一个网站可以有两个容器; 主容器和辅助容器。

主容器是主要内容出现的页面。

辅助容器组成侧边栏和侧边栏中的各种小部件。

借助“全宽/包含”布局,您可以组合主容器和辅助容器。 然后可以将这些容器显示在单个容器中以获得更整洁的外观。 “全宽/包含”布局在单个容器中并排显示内容和侧边栏。 该容器将在容器周围留出空间,因为它以容器宽度显示。

可以通过转到“外观”并遵循以下路径来更改或更改容器设置:

外观 > 自定义 > 全局 > 容器

4.png

全宽/包含布局非常适合那些需要整洁设计、没有任何框或网格边界的网站。 通过与 WooCommerce、LifterLMS 等plugin集成,可以将此布局设置为默认布局。

许多页面构建器(例如 Visual Composer)需要主题来控制容器的宽度。 出于同样的原因,他们推荐全宽/包含布局。

Astra Pro Addonplugin的专用模块提供了更多的样式选项。

内容盒装 – 容器布局

文档 » 定制器设置 » 全局 » 内容装箱 – 容器布局

我们之前讨论过,通常一个网站可以有两个容器:

主容器:主要内容出现的地方

辅助容器:由侧边栏和各种不同的小部件组成

如果您选择“内容盒装布局”,则只有主容器将以盒装格式显示。 然而,辅助容器将保留在纯背景上。

5.png

如果你想让你网站的内容区域比侧边栏更加突出,那么选择这种布局是理想的。 简而言之,内容盒装布局非常适合内容网站和博客。

盒装布局的设置可以如下找到:

 外观 > 自定义 > 全局 > 容器

此外,如果您想为各个页面应用不同的容器,您可以通过元设置来完成。

  • 内容盒装容器可以应用于元设置中选定的页面或帖子。
  • 站点布局设置决定容器的宽度。
  • 借助 Astra Pro Addonplugin,您可以通过颜色和背景模块更改网站背景颜色。 但是,如果您没有 Astra Pro,那么您也可以使用自定义 CSS 添加背景图像。

Astra免费主题的特点

Astra 无疑是 Elementor 的最佳主题。 它与 Elementor 配合得很好,这使其成为构建网站的最佳免费主题。 下面,我们讨论了使 Astra 成为最佳主题的功能。

全宽/拉伸布局

Astra 提供了专为 Elementor 制作的全宽/拉伸布局。 通过这种布局,Elementor 可以完全控制您的布局,使您免于包含复杂的 JavaScript 方法以将行或部分扩展到全宽度的麻烦。

全宽或拉伸.png

借助 Astra,您可以轻松禁用侧边栏、页面标题、面包屑和特色图像,从而获得使用 Elementor 进行设计的完全自由。 通过禁用这些功能,您可以获得一个空白画布,这使您可以从头开始设计您的网站 - 按照您想要的方式设计。 您甚至可以构建自定义登陆页面,禁用 Astra 的页眉和页脚,以便 Elementor 享有对该页面的完全控制。

大多数主题默认输出这些功能,因此减少了用户设计站点的控制。

禁用.png

定制器的全局选项

Astra 全局选项允许您在定制器中设置所需的布局、侧边栏和其他适合 Elementor 的自定义设置。 全局选项是理想的选择,特别是如果您正在构建一个大多数页面都是使用 Elementor 设计的网站。

同样,如果您想要对各个页面进行不同的设置,那么全局选项将被这些单独的设置覆盖。

全局选项.png

兼容 Elementor Pro 2.0

Astra 是少数与 Elementor 2.0 主题生成器完全兼容的主题之一。 通过使用 Astra 和 Elementor Pro 2.0 主题生成器,您可以对网站的各个方面进行微观设计。 无论是选择不同的页眉、页脚、博客模板还是其他任何内容,您都可以使用这两个强大的工具来实现。

elementor.png

元素整合

Astra 提供与 Elementor 的智能集成。 如果您使用 Elementor 构建页面,Astra 将自动设置最适合 Elementor 的选项。 这种智能集成可以节省大量时间和精力,您可以将其用于其他重要的事情。

Astra 提供超过 30 种类型的页眉和 10 多种类型的页脚。 您可以选择想要透明标题还是实心标题。 您甚至可以根据您的自定义要求,使用 Astra Pro 插件在 elementor 上从头开始构建标头。

页眉页脚.png

移动标头选项

您可以使用 Astra 制作移动响应网站。 Astra 为移动响应式菜单提供了便捷的解决方案,在定制器中设置非常简单。 这使您可以控制和设计漂亮的移动菜单。 您无需任何自定义代码即可构建整个菜单。

移动标题.png

轻量且无膨胀

Astra 为 Elementor 提供支持。 这意味着 Astra 不会复制 elementor 提供的功能。 Astra 是轻量级模块化主题。 它负责装饰,例如全局颜色、排版、样式以及第三方plugin集成。 不过,Elementor 处理页面构建部分。

轻量级.png

关于“使用 Astra 免费主题设置全宽或盒装内容”的 2 个想法

  1. 我有一个关于定制容器的问题。 它的宽度是可以调整的。 但我没有读到如何调整容器盒(块)的高度。 我的网站上有太多白色。 我希望通过降低正文所在的块的高度来使正文文本更接近标题。

    1. 您好,高度没有设置,它是由所有页面部分内容+边距定义的。 就您而言,我猜这是标题或第一部分的边距/填充问题。

发表评论

您的电子邮件地址不会被公开。 必需的地方已做标记*