如何使用Bricks Builder搭建WordPress网站

即使你是初学者，创建 WordPress 网站也并非难事。只要有正确的工具和指导，你就能快速创建并运行一个美观、功能齐全的网站。

本指南将向你展示如何使用 Bricks Builder 构建 WordPress 网站，这是一款功能强大的主题生成器，无需编写任何代码即可提供广泛的自定义功能。

Bricks Builder 概述

Bricks Builder 是一款可视化网站生成器，允许用户直接在 WordPress 环境中创建自定义的响应式网站。它与 WordPress 无缝集成，旨在增强用户体验，使初学者和有经验的开发人员都能通过拖放界面可视化地构建网站。

与 Elementor 和其他建站工具不同，Bricks 是一个主题，而不是插件。它几乎集成了所有功能，而其他建站工具需要使用额外的插件。

它具有实时前端编辑体验，这意味着你可以在调整设计元素和布局时实时看到自己的变化。

Bricks 实时前端编辑界面

它提供了一个全面的工具包，包括预设计模板、大量设计元素和高级定制选项，可用于更详细的网站开发。

此外，Bricks Builder 还支持动态数据，允许用户轻松建立数据驱动型网站，并在模板中动态整合内容。

使用 WordPress Bricks 的好处

Bricks Builder 以其性能和灵活性脱颖而出。与其他生成器相比，它是一种更新但强大的替代方案，可提供以下功能：

• 速度 – Bricks 的速度快得令人难以置信，而且非常轻便。
• 易用性 – 界面直观，初学者和专业人士都能轻松使用。
• 自定义 – Bricks 可通过自定义 CSS 和 JavaScript 提供广泛的自定义功能，并与各种 WordPress 插件兼容。

开始使用 Bricks

Bricks 是一款需要付费订阅的高级主题。要使用它，您需要购买其中一个计划。付款后，您可以在仪表板上下载一个 zip 文件，该文件可以上传到您的 WordPress 网站，同时还有一个许可证密钥，可以在您的 WordPress 安装中激活 Bricks。

下载 Bricks 主题。

安装 Bricks 主题后，WordPress 面板上会出现一个新的 Bricks 菜单项。

要激活许可证，请进入仪表板，点击 Activate license，输入 Bricks 账户中的许可证密钥，然后点击 Activate。这将启用 Bricks 主题的全部功能。

配置 Bricks 主题许可证以激活主题。

如果您想在购买前试用 Bricks，可以在 try.bricksbuilder.io 上建立试用账户。该平台提供了一个安装了 Bricks 的预配置 WordPress 网站，让您可以免费探索其特性和功能。

欢迎来到 Bricks WordPress 仪表板界面。

如何启动 Bricks 页面生成器

要使用砖块页面生成器设计一个新页面，请导航至页面 > 新页面或单击现有页面。点击 “Edit with Bricks“，即可启动 Bricks 编辑器。

单击 “Edit with Bricks” 启动 Bricks 页面生成器。

现在，你可以从 Elements panel（元素面板）拖动元素来设计页面。

了解 Bricks 界面

Bricks 界面与 WordPress 环境无缝集成。

给 Bricks 界面贴上标签，了解每个部分的含义。

以下是其核心界面的细分：

• Builder workspace（生成器工作区）– Bricks 的主要区域是生成器工作区，它是网站的可视化呈现。在这里，你可以直接与页面互动，拖动元素到位、调整大小和重新排列组件。
• Toolbar（工具栏）– 在工作区的顶部，工具栏可以快速访问基本功能，如保存工作、预览网站、访问设置菜单和响应控件。
• Elements panel（元素面板）– 在界面左侧，元素面板是你的工具箱。它包含了你可以在网站上使用的所有构件，如文本框、图片、按钮等。你可以将这些元素直接从面板拖到页面上。
• Structure view（结构视图）– 结构视图通常位于元素面板旁边或作为元素面板内的一个切换项，它提供了页面的层次轮廓。该视图对于了解页面元素的布局和深度特别有用，可以让你轻松选择和编辑嵌套项。

在 Bricks 中使用自定义字体

Bricks 提供了令人兴奋的功能，允许您将自定义字体上传到 WordPress 网站。为此，请导航至 Bricks > Custom Fonts。

在 Bricks 中使用自定义字体。

本部分允许您上传各种格式的字体文件，包括 WOFF2、WOFF 或 TTF。您还可以上传不同的字体变体，例如细体、半粗体、正常字体和粗体。

要添加自定义字体，请单击 Add New。然后，在 Add title 字段中输入字体名称。接着，选择要上传的字体变体，选择字体样式，然后单击 Edit。

添加字体详细信息并上传不同的字体变体。

将出现一个下拉菜单，提供用于上传字体文件的字段。选择字体文件并上传。您可以通过单击 Add a font variant 来重复此过程，以获得尽可能多的变体。最后，单击 “Publish“。

Bricks 自定义字体页面。

要将新上传的自定义字体应用到 WordPress 网站上的文本，请按照以下步骤操作：

1. 转到要使用新字体的页面，然后单击 “Edit with Bricks“。
2. 单击要更改的文本。
3. 所选文本的相关信息将显示在左侧面板中。单击样式。
4. 展开 “TYPOGRAPHY” 下拉菜单，查看更多选项。
5. 在 Font family 字段中，浏览可用字体，包括 Google 字体和自定义上传字体。
6. 从列表中选择自定义字体，立即更新文本。

现在，您的文本将使用自定义字体显示，为您的页面增添个性化气息。

在 Bricks 界面中使用 Bricks 自定义字体。

在 Bricks 中使用模板

模板是 Bricks 中的一项基本功能，有多种类型，包括页眉、页脚和博客文章布局。这些模板的范围从单一部分（如网站页眉或英雄部分）到全页面内容（如博客文章布局、存档页面、搜索结果和错误页面）。

创建模板

要创建创建模板：

1. 导航至仪表板中的 “Bricks“>”Templates“。
2. 选择添加新模板或导入现有模板。
3. 单击Add New，选择模板类型，然后选择Edit with Bricks。如下图所示：为您的 Bricks Builder 创建新模板。
   
    

应用模板

将模板应用到页面：

1. 导航至要使用模板的页面。
2. 单击创建工具栏中的Templates （文件夹）图标，打开模板部分。如下图所示：将模板应用到 Bricks 页面。

   
    

3. 在这里，您可以访问自己创建的模板和社区模板。
4. 选择所需模板并预览。如下图所示：Bricks 模板商店 – 包含社区、本地和远程模板。
    
5. 最后点击 Insert 即可应用。如下图所示：选择并使用选定的社区模板。  

远程模板

Bricks 的模板具有其他建站工具所不具备的独特功能。远程模板是指你想在自己的网站中使用其他网站创建和使用的模板。

要允许其他网站使用你的 Bricks 模板，请进入 WordPress 面板中的 Bricks > Settings > Templates，然后启用 My Templates Access 复选框。

使用 Whitelist URLs 和 Password Protection，限制知道正确密码的人员访问模板。

允许其他网站使用你的 Bricks 模板作为远程模板。

要使用其他网站的模板，请进入 Bricks > Settings > Templates，滚动到 Remote templates 部分，然后在 Remote template URL 字段中粘贴您要检索模板的 Bricks 网站的 URL。

使用其他网站的远程模板。

如果设置了密码，必须确保将密码写在远程模板 Password 下。然后单击 Save Settings。

要使用这些模板，请导航到页面生成器，然后像以前一样单击 Templates；将出现一个新的 Remote templates 部分，其中包含来自远程站点的所有模板。

在 Bricks 中使用动态数据

Bricks 允许您在模板和页面中加入动态数据，使其成为构建动态网站的多功能工具。

您可以加入各种动态元素，如特色图片、文章标题、发布日期、作者姓名、类别、标签、网站标题和所有自定义字段。

在 Bricks 中创建特定模板（如博客文章模板或自定义文章类型模板，如单一房产列表）时，动态数据尤其有用。

要添加动态数据，请在画布上开始键入 { 或单击设置面板中大多数字段旁边的 “螺栓” 图标。

下面介绍如何使用 Bricks 动态数据创建单个文章模板：

1. 导航至 Bricks > Template，创建一个新模板。为模板指定标题，将其类型设为Single，然后Publish或Save as draft。
2. 单击 “Edit with Bricks“，开始配置模板以使用动态数据。
3. 根据需要设计页面样式。通常情况下，你需要将文章标题、特色图片、发布日期、作者姓名和文章内容等元素全部设置为动态显示。
4. 在空白页面上，通过在 Heading 元素中插入 {post_title} 来添加标题和内容，在 Basic text 元素中插入 {post_content} 来添加标题和内容。如下图所示：在 Bricks 中使用动态数据

    

要将此模板设置为所有帖子的默认模板，请：

1. 单击工具栏中的设置图标，转到 Template Settings > Conditions，然后单击 + ADD CONDITION 按钮。
2. 选择 Post type 并指定 Posts。如下图所示：将模板设置为所有文章的默认设置。
    

   
    

3. 确保保存并更新 WordPress 上的模板页面。然后，导航到 “文章” 页面，查看每个文章的新模板格式，无需额外样式。如下图所示：模板用于所有文章。
    

    

为简化该模板的样式，请添加一个默认文章作为动态元素的参考：

1. 单击工具栏上的设置图标，转到Template Settings > POPULATE CONTENT。
2. 选择 Single post/page 作为内容类型，然后选择一个特定的帖子作为模板内容。如果没有出现，请确保搜索一个，然后点击 APPLY PREVIEW。如下图所示：添加默认文章作为动态元素的参考。
    

    

3. 现在您可以使用选定的模板文章轻松显示文章标题和内容等元素。如下图所示：使用动态数据定制页面时，会显示选定的默认文章。
    

此外，Bricks 还支持使用Advanced Custom Fields (ACF) 中的内容，从而增强了您创建详细的定制页面的能力。

使用 Bricks 处理表单提交

Bricks 1.9.2 引入了表单提交功能，允许您捕获表单提交。这允许您在数据库中创建一个名为 bricks_form_submissions 的自定义表（加上您的 WP 数据库前缀）。

您可以在 Bricks > Settings > General > Miscellaneous 下启用新的 Save form submissions in database（在数据库中保存表单提交）设置。

使用 Bricks 处理表单提交。

然后点击 Save Settings。表单提交选项卡将出现（Bricks > Form Submissions），其中包含各种表单提交表。

收集表单提交

在 Bricks 中收集表单提交不需要额外的插件。你只需使用 Form 元素创建一个表单，并正确设置字段。

在 Bricks 页面添加表单元素。

在设置面板中单击 “Actions“，然后选择 “Save Submission” 操作。

为 Bricks Form 元素设置保存提交操作。

接下来，单击 Save Submission 设置，为表单命名。该名称将用于访问表单中的数据。

为表单提交页面设置描述性表单名称。

现在，当你保存并打开页面时。您可以完成表单，然后回到 Bricks > Form Submission 页面查看表单数据。

Bricks Form Submission 页面可访问所有表单及其数据。

您还可以下载各种表单提交的 CSV 文件。在您配置此功能的 Bricks > Settings > General > Miscellaneous 部分，您可以重置或删除数据库表。

重置或删除表单数据库表。

在 Bricks 中使用 WooCommerce

WooCommerce 是一款免费插件，可增强 WordPress 网站的电子商务功能。它是全球公认的建立和管理网上商店的领先开源解决方案。

Bricks 可与 WooCommerce 无缝集成，提供一个强大的主题生成器，用于创建从商店主页到单个产品页面、产品档案、购物车、结账和账户页面的整个商店。

Bricks 为 WooCommerce 提供专门的元素和模板，让您可以设计店铺布局。

用于 WooCommerce 网站的 Bricks 产品元素。

要开始使用 Bricks 中的 WooCommerce 生成器，请安装并激活 WooCommerce 插件。激活后，您可以使用 Bricks 可视化地设计和定制各种 WooCommerce 模板，就像管理单个文章布局一样。

创建一个简单的商店页面：

1. 导航至页面并选择 Shop 页面。

2. 单击 “Edit with Bricks“。元素面板包含各种产品元素。通过这些元素，您可以显示产品、标题、描述、价格等，从而方便创建动态模板。

将 WooCommerce 与 Bricks Builder 结合使用。

使用这些元素，你可以根据需要安排和设计页面样式。

与创建单个文章模板一样，您也可以创建单个产品模板，并设置其适用于所有产品的条件。

Bricks 中的查询循环

查询循环创建器可让您根据查询参数查询数据库，并在循环中显示您希望显示的查询结果。它可用于容器、折叠式和滑块等布局元素。

你可以查询文章类型、分类术语和用户。例如，你可以查询博客作者、社区成员和团队成员的列表。

要使用查询循环，请在画布上添加一个容器元素。启用 “Use Query Loop” 设置，将容器变成循环项。

启用 “Use Query Loop” 设置后，你会看到一个查询控件（无穷大图标）。单击该图标打开查询控件并设置查询参数，以便从数据库中检索内容。

在用于文章的 Bricks 容器元素中使用查询循环。

容器现在是你的重复项。只要有查询结果，容器内的所有元素就会重复出现。本教学指南将解释其工作原理。

Bricks 定价

Bricks 没有免费计划。他们只创建一个账户，让你试用他们的主题，但除非你付费，否则不能在你的网站上使用。

Bricks 提供基本计划和终身计划。终身计划提供无限权限，但你可以决定自己想要什么。

他们提供的便利是，在该平台上几乎可以提供你所需要的一切，有助于实现无缝、高效的工作流程，对于那些寻求强大、多功能网页设计解决方案的人来说，这是一项值得投资的项目。

Bricks Builder 的定价结构。

Bricks 值得一试吗？

与 Elementor 不同，Bricks 不提供免费版本，这是一个潜在的缺点。不过，Bricks Builder 凭借其简洁性和强大功能的完美结合，在业内备受关注。

2024 年，The Admin Bar 对 1,144 名 WordPress 专业人士进行了一项调查，结果显示 “Bricks 是唯一一款使用人数比去年有所增加的页面生成器，占总数的 32%”，具体数据如下表所示：

显示WordPress专业人员最常用的页面生成器的统计数据。

这表明，尽管页面生成器仍是市场上一个相对较新的产品，但有多少 WordPress 专业人士正在使用它。

Bricks 作为一个完整的主题运行。这意味着你不能将其他主题的功能与它的页面生成器混搭使用。此外，就速度而言，作为一款专为高性能网站设计的较新页面生成器，Bricks Builder 被认为比 Elementor Pro 更快。

仅使用专为速度而设计的页面生成器并不能保证最佳性能。无论您要创建什么类型的网站，您的托管服务提供商在网站性能方面都起着至关重要的作用。

小结

本文探讨了 Bricks 生成器、其工作原理、部分功能以及使用方法。我们研究了它基于主题的综合方法、定制功能和性能优势。

虽然 Bricks 没有像 Elementor 那样的免费版本，但它的集成设计和频繁更新可以为优化网站性能提供卓越的效率。

你对如何使用 WordPress Bricks 主题生成器有任何疑问吗？请在下面的评论区告诉我们！