要求

开发一个拥有10个以上页面的物业预订(出租)网站自定义主题高级自定义字段插件和WPML插件。该网站有以下特点。

这是项目的要求。

• 使用WordPress构建，并有10+个自定义主题设计页面
• 多语言网站-中、法、英
• 自定义设计的主页，列出可用属性和特色属性。
• 自定义设计的属性页。
• 自订表格供租户申请物业，并提供详细资料。
• 管理仪表板
• 租户仪表板
• 工作人员指示板
• 分条在线支付网关集成

要求

客户在法国有住所/房产出租。目标受众主要是学生。因此，在向租户出租房产之前，需要从他们那里收集很多信息。因此，客户决定开发一个网站，允许租户(学生)在网站上查看可用的物业，并通过提供必要的详细信息，如一般信息，上传一般文件，职业详细信息，付款详细信息等，来申请该物业。这样我们的客户就可以审阅租客申请并分配房间客户付款成功．

使用Advanced custom Fields Pro插件和WPML插件开发一个10+页的物业预订(出租)网站。该网站有以下特点。

• 使用WordPress构建，并有10+个自定义主题设计页面
• 多语言网站-中、法、英
• 加载速度很快
• 自定义设计的主页，列出可用属性和特色属性。
• 自定义设计的属性页。
• 自定义设计属性详细页面。
• 自订表格供租户申请物业，并提供详细资料。
• 管理仪表板
• 租户仪表板
• 工作人员指示板
• 分条在线支付网关集成
• 房间可用性日历
• 管理员的整体占用日历，可以在单个日历中查看房间的预订状态
• 管理员，员工和租户的登录功能
• 管理员可以添加属性，所有者。
• 管理员可以在核实租户的文件后为他们分配房间。
• 属性显示房间细节，如已占用的房间，未占用的房间等。
• 经过验证后，管理员可以根据可用房间向租户发送付款请求，租户可以使用集成的Stripe支付网关在网站上支付金额。

网站开发流程

以下是我们的方法，以及我们如何从零开始开发网站，以推动业务朝着其愿景发展。

网站开发流程

我们的网站开发分为两个阶段，第一阶段是面向功能的，第二阶段是面向设计的，添加了很少的功能。因为它是自定义wordpress需求而且还没有现成的主题来实现这个功能，我们从头开始进行自定义主题开发。

网站设计方案

尽管第一阶段是面向功能的，但客户与我们分享了现有的网站URL，作为在WIX中开发的设计参考。所以我们把它作为设计和开发功能的参考。
以下是我们在以WIX网站为参考进行网站开发时所考虑的要点。

• 使用WIX网站的CMS页面设计
• 对近期的市场目标进行头脑风暴
• 在提交自定义表单时为租户提供更好的用户流程。

第一阶段

最初在第一阶段，客户的想法是有一个自定义多页面应用程序租户的表格，大约有50个字段，他们可以提交表格，管理员可以审查提交的申请。如果需要更改，管理员可以从承租者那里选择需要更正或更改的特定字段，并从管理仪表板本身请求承租者更正该字段。租户将收到一封电子邮件，他可以登录网站并在修改该字段后提交申请。在确认后，管理员将向租户发送付款请求，让租户在网站上付款，付款成功后，租户将在请求的物业中分配一个房间。

自定义web应用程序表单是网站的核心。所以它有各种各样的功能，比如自定义验证，如果管理员想从租户那里更改字段，可以为租户提供特定的字段编辑选项等等。

由于房间是为学生提供的，他们可能不需要支付费用，他们的父母/监护人可能会支付费用。但在开发的第一阶段，管理员可以通过网站输入向租户收取的金额，租户将通过他的仪表板支付。

在租户方面，可以分为三种类型。

• 目前的租户
• 悬而未决的租户
• 拒绝了租户

在Pending Tenant中，还有3个子类别。

• 尚未填写申请表格(待办文件)的租户
• 提交申请但尚未得到管理员批准的租户(等待审批)
• 租户申请被批准，管理员发出付款请求但尚未付款。(等待支付)

我们使用WPML多语言插件开发了3种语言的网站。在支付集成方面，我们集成了STRIPE支付网关。

第二阶段:

客户对流程和功能都很满意，他决定去自定义UI设计为了整个网站，放弃基于WIX的设计，我们在第一阶段所做的。而且客户在现有的网站上增加了很少的功能。

-第二阶段功能:

• 完整的UI重新设计为整个网站
• 统计数据
• 待定租户摘要
• 日历视图中的总体占用状态
• 整个网站从前端管理，没有太多的后端使用。
• 管理员通知模块
• 付款将分为(申请费-一次及选定期间的租金-定期)
• 在“房客入住时间”部分为房客分配房间
• 查看所有提交的文件(在显示图像和PDF查看器的自定义弹出窗口中查看)
• SEPA支付的整合

-第二阶段UI设计过程

第一阶段在没有任何设计师干涉的情况下完成。客户在看到最终产品后想要包含一个平面设计师对于以下内容

1. 更好的用户体验
2. 应用程序中的无缝流程流
3. 减少妨碍用户正常使用的不必要的故障
4. 为应用程序中的每次更新创建电子邮件模板
5. 更新网站与应用程序并行
6. 确保小微互动增强用户体验

-第二阶段发展过程

与第一阶段不同的是，在这里我们有整个网站所有页面的线框，这使得我们的设计转换工作更加容易。在开发的第二阶段，我们规划了要开发的模块，并计划每周向客户演示，以查看进度。

-具有挑战性的模块:

尽管整个网站是定制开发的，但在第二阶段的开发中有两个具有挑战性的模块。下面是第二阶段的两个复杂功能。

• 日历视图中的总体占用状态
• SEPA支付的整合
• 设计匹配多种语言

-整体入住日历:

这是一个自定义日历，在一个视图中显示所有属性和房间的可用性状态1年。为此，我们计划了各种日历库和解决方案，并使用jQuery Datepicker自定义构建了一个占用日历。

国家环保总局支付:

SEPA支付是欧洲国家广泛使用的一种著名的支付方式。在此方法中，我们必须以IBAN格式收集客户的姓名和银行帐号。作为付款确认的一部分，客户必须接受授权，授权我们按约定每月/一次等方式扣款。一旦海关提供上述信息，我们就可以按月收取租金。尽管文档对于SEPA支付的Stripe非常有限，但我们能够完成这个模块。

设计匹配多种语言

由于网站上有三种语言，我们必须确保这三种语言的设计看起来是一样的。例如，在相同的字体大小下，中文字母要比英文和法文字母大得多。所以我们必须确保整个网站的设计和流程不会被任何语言打断。

网站迁移过程

我们将网站托管在亚马逊AWS服务器上。因此,网站迁移过程和其他主机相比有点不同。自从AWS以来，我们一直在AWS CLI上工作，而不是Cpanel。在迁移网站时，我们遵循以下步骤。

• 使用WP引擎迁移插件迁移网站
• 正在修复CSS
• 使网站在各个页面上看起来一致
• 从功能测试和修复开始
• 通过设计人员级别的测试和修复
• 测试结束后，我们必须删除测试数据。
• 通过最终的实时测试和修复

结果

• 标题中的简单导航增加了200%的点击量
• 页面在4秒内加载
• 简单的登录/注册
• 更好的租户形式的用户体验
• 管理房间日历可用性。
• 管理员的整体占用日历，可以在一个视图中查看所有属性的可用性状态
• 能够通过改进的用户旅程付款方式吸引更多租户
• 网站准备进行新的营销活动，以吸引更多的用户

作为顶尖的房地产解决方案ColorWhistle可以创建web应用程序和网站，帮助您的访问者轻松掌握您的内容。从集成多重上市系统(MLS)到门户，我们可以创建有效的解决方案，以满足您的业务挑战和目标。我们也可以创造多样化的房地产解决方案现代房地产网站设计．

如果你需要任何网站设计方面的帮助网站开发对于在线学习,保持联系或致电+1(919)234-5140。我们很高兴与您合作，创造互动房地产解决方案。