Divi 插件亮点：酒店预订和 Divi 集成

MotoPress 的酒店预订是 WordPress 最受欢迎的预订插件之一。 它与 Divi 很好地集成在一起，但作为一个独立的插件，它没有利用 Divi Builder 及其设计功能。 使用 MotoPress 插件 Hotel Booking & Divi Integration 可以实现酒店预订 Divi 集成。

使用酒店预订的免费或高级版本，可以轻松地将酒店预订功能添加到任何 Divi 网站并使用 Divi Builder 对其进行设计。 在本文中，我们将了解各种插件和选项，了解它们如何与 Divi Builder 配合使用，并了解它们在 Divi 布局中的集成情况。

酒店预订插件

下面来看看酒店预订 Divi 集成插件。

酒店预订精简版

Hotel Booking 的精简版是免费的。 这是一个专门为住宿企业制作的物业租赁插件。 它可以处理无限的房间、提供物业详情、智能搜索、无限的房价变量、最短和最长入住时间、免费或付费的额外服务、优惠券、税费、每位客人的多种住宿等等。

它还包括多种货币、本地化、短代码和小部件。 它拥有您开始物业管理所需的一切，并包括 PayPal 集成。 对于本文，我将使用 Lite 版本。

酒店预订专业版

Pro 版增加了更多的支付网关、与 OTA（交换日历）的自动同步、从后端添加预订的能力、基于客人数量和入住晚数的可变定价等选项，以及优先更新和支持。

酒店预订和 Divi 整合

酒店预订和 Divi 集成是一个免费的插件，它向 Divi Builder 添加了新模块，因此您可以构建预订页面并使用 Divi 对其进行样式设置。 这些模块允许 Divi 将住宿设置为列表、单个住宿、服务、表单、搜索等。它包括启用或禁用几乎每个元素的功能，以便您可以自定义它们的显示方式。 使用 Divi 模块的样式与任何模块的工作方式相同，因此您可以完全控制它的外观。

使用酒店预订和 Divi 集成

酒店预订的默认新页面

安装 Hotel Booking 插件后，您将看到安装页面的消息。 这些是酒店预订引擎用于交易等的页面，因此我建议您创建它们。 单击按钮。

八个新发布的页面将添加到您的 WordPress 安装中。 这些页面包含标题和一个短代码，告诉预订系统使用哪些页面来提供信息。 如果您不使用 Divi Builder，将使用这些页面。 我更喜欢单击创建它们，然后使用 Divi 自定义每个。 这会准确地告诉您需要构建哪些页面。

当然，您也可以在其他布局中使用这些页面中的短代码，但由于 Divi Builder 模块，您将不需要它们。

这是住宿页面的示例。 它添加了标题和短代码以显示它们。 它显示了特色图片滑块、图库以及有关每个图片的信息。 我已将小部件添加到侧边栏以显示住宿类型。

分区模块

新模块添加到 Divi Builder。 它们包括：

• 列表
• 费率
• 住宿服务
• 预订表格
• 搜索可用性
• 单身住宿。

这些模块使您可以使用 Divi 创建完整的页面或在 Divi 布局中添加单个功能。

Divi 模块示例

我使用 Divi Builder 重新创建了与住宿页面相同的布局。 我添加了侧边栏只是为了匹配。

结果非常相似。 当然，现在我们可以使用样式和布局选项。

这些模块使您可以完全控制显示的内容。

它包括许多自定义项，因此您可以控制诸如类别、标签、排序、排序依据、页面上显示的数量等元素。它甚至还有一个逻辑关系选项，可在存在多个分类法时帮助确定分类法。

我已将其设置为按日期升序显示每页一个。 该页面已经更干净，更易于使用。 我已经删除了描述和预订按钮。 特色图像是带有控件的滑块。 由于我限制了它可以显示的住宿数量，因此它会自动添加分页。

在这里，我重新添加了摘录和详细信息，并使用前端构建器为“设计”选项卡中的文本设置样式。 我添加了一个带有一些填充的框阴影。

您还可以根据 ID 指定将显示哪些住宿。 在此示例中，我创建了一个包含两个住宿列表模块的新布局。 每个都显示一个特定的 ID。 它们包括框阴影和间距。

Single Accommodation 模块可让您根据 ID 显示您想要的任何住宿。 它包含与列表模块相同的功能，可以禁用或设置任何元素的样式。

搜索可用性模块允许您的访问者根据入住日期、退房日期、成人人数和儿童人数进行搜索。 您可以设置限制并添加属性。 它包括三种布局。 这是默认设置。 我添加了一个框阴影，使其与背景分开。

这是水平居中布局。 这将非常适合作为登录页面中的一个部分。 水平左侧看起来相同，但将搜索框放在左侧。 在此示例中，我添加了边框、更改了背景颜色、更改了字体颜色，并将字段标题字体设置为全部大写。

住宿服务模块根据 ID 显示所有服务或特定服务。 它包括我们习惯的所有相同设计功能。 如果没有 ID，它将在列表中显示所有服务。 添加 ID 意味着您可以将任何服务放置在任何位置，并通过使用多个模块以任何布局显示多个服务。

将酒店预订整合到 Divi 布局中

任何 Divi 布局都可以自定义以创建酒店网站，但有一些布局无需太多更改即可完美运行，例如 Real Estate、Travel Blog 和 Bed and Breakfast。 我正在使用床和早餐（并且，由于写了这篇文章，我现在想开始床和早餐）。

在这个例子中，我删除了简介和按钮，并将搜索可用性模块添加到登录页面的英雄区域。 它使用水平左侧布局。 我保留了默认设置。

在这个例子中，我用一个住宿列表模块替换了嵌入视频下面的画廊。 我已将其设置为显示一个，但如果您想查看更多内容，它确实包括分页。 我禁用了大部分文本，但它确实显示了详细信息按钮。

它看起来与此布局中的原始部分几乎完全相同，但现在我们可以通过简单地粘贴其 ID 来选择特定的房间或住宿来显示和更改它们。 分页还有助于在同一空间中提供更多信息。

结束的想法

酒店预订和 Divi 集成易于设置和使用。 我从不需要阅读说明，但如果您想阅读它，它们确实包含详细的博客文章，可以引导您完成它。 我喜欢将 Divi Builder 用于 Hotel Booking 创建的所有页面。

即使在 Divi Builder 中，也可以为元素添加短代码，但设计选项仍然有限，这可以通过使用 Divi 模块解决。 使用 Divi Builder 可以更轻松地为您的页面创建一些独特的样式，并且可以轻松地在您想要的布局中添加确切的元素。

MotoPress 确实有几个可用于 WordPress 的酒店和物业租赁主题。 我想看到一些 Divi 布局添加到列表中。 Elegant Themes 已经有几种布局非常适合酒店和住宿加早餐类型的租赁业务，因此使用 Hotel Booking & Divi Integration 感觉很自然。

如果您使用 Divi 建立酒店和租赁网站，那么您需要酒店预订 Divi 集成。 我强烈建议您使用 Hotel Booking 插件的免费版本以及 Hotel Booking & Divi Integration 插件。 现在我必须去计划我的 B&B。

我们希望听到您的意见。 您是否尝试过酒店预订和 Divi 集成？ 请在下面的评论中告诉我们您对此的看法。

精选图片来自 Sira Anamwong/shutterstock.com