如何在WordPress中添加抵押贷款计算器（逐步操作）

Recently one of our readers asked about adding a mortgage calculator in WordPress.

最近，我们的一位读者问有关在WordPress中添加抵押计算器的问题。

A mortgage calculator is a useful tool for real estate websites because it allows visitors to see if they can afford the property they’re looking at.

抵押计算器是房地产网站的有用工具，因为它允许访问者查看他们是否负担得起所看物业。

In this article, we will show you how to easily add a mortgage calculator in WordPress.

在本文中，我们将向您展示如何轻松地在WordPress中添加抵押贷款计算器。

什么是抵押计算器？ 谁在他们的网站上需要它？ (What is a Mortgage Calculator? Who Needs It on Their Website?)

A mortgage calculator is a tool that allows users to get estimates for their mortgage payment, with interest rate and amortization period.

抵押贷款计算器是一种工具，它使用户可以获取抵押贷款付款的估计以及利率和摊销期限。

With a mortgage calculator, your website visitors can select a monthly payment or period, and the mortgage calculator form will calculate the costs based on a given interest rate.

使用抵押计算器，您的网站访问者可以选择每月付款或期限，抵押计算器表格将根据给定的利率计算成本。

If you are making a real website with IDX property listings, then a mortgage calculator will help you get more leads and increase user engagement on your website.

如果您使用IDX财产清单来构建一个真正的网站 ，那么抵押贷款计算器将帮助您获得更多潜在客户并增加用户在您网站上的参与度。

That being said, let’s take a look at how to easily create a mortgage calculator in WordPress.

话虽如此，让我们看一下如何轻松地在WordPress中创建抵押计算器。

创建一个WordPress抵押计算器–(逐步) (Creating a WordPress Mortgage Calculator – (Step by Step))

Adding a mortgage calculator in WordPress used to be quite difficult. Either you had to add a piece of code to your site or install a third-party mortgage calculator service.

在WordPress中添加抵押贷款计算器曾经非常困难。 您要么在网站上添加了一段代码，要么安装了第三方抵押计算器服务。

Now, with Formidable Forms, you can easily create a mortgage calculator with a drag and drop interface.

现在，借助“ 强大的表单” ，您可以轻松创建具有拖放界面的抵押计算器。

Formidable Forms is the most advanced WordPress form builder plugin on the market. It allows you to create advanced forms like an online quiz, web directory, job listings, calculators and more.

强大的表单是市场上最先进的WordPress表单构建器插件 。 它使您可以创建高级表单，例如在线测验 ， Web目录 ，工作清单，计算器等。

Formidable makes it easy to build advanced forms without writing code. You can use features like conditional logic, advanced calculations, file uploads, repeater fields, dynamic pre-filled fields, and more.

强大的功能使无需编写代码即可轻松构建高级表单。 您可以使用条件逻辑，高级计算，文件上传，转发器字段，动态预填充字段等功能。

It comes with super useful pre-made templates for more than 20 types of forms. We will be using their mortgage calculator template as a starting point for this tutorial.

它带有超有用的预制模板，可用于20多种类型的表单。 我们将使用他们的抵押计算器模板作为本教程的起点。

Let’s get started.

让我们开始吧。

First thing you need to do is to install and activate the Formidable Forms plugin. For more details, see our step by step guide on how to install a WordPress plugin.

您需要做的第一件事是安装并激活Formidable Forms插件。 有关更多详细信息，请参阅有关如何安装WordPress插件的分步指南。

You’ll need at least their Business plan to use the mortgage calculator feature.

您至少需要他们的业务计划才能使用抵押计算器。

Upon activation, you need to click on the ‘Add your license key now’ option to enter your license details.

激活后，您需要单击“立即添加许可证密钥”选项以输入许可证详细信息。

This will take you to the Global Settings page where you’ll need to enter your Formidable Forms license key.

这将带您进入“全局设置”页面，您需要在其中输入您的“强大表单”许可证密钥。

You can find the license key in your account area on the Formidable Forms website.

您可以在“强大表单”网站上的帐户区域中找到许可证密钥。

Once done, you will see the license activation success message. Now you can simply refresh your page to load the premium features.

完成后，您将看到许可证激活成功消息。 现在，您只需刷新页面即可加载高级功能。

After that, go to Formidable » Forms to add a new form. There, you will see a Contact Us form already added by default. Go ahead and click on the ‘Add New’ button to create a new mortgage calculator form.

然后，转到“ 强大»表单”以添加新表单。 在那里，您将看到默认情况下已添加的“联系我们”表单。 继续并单击“添加新”按钮以创建新的抵押计算器表单。

On the next page, you will see many pre-made templates which help you quick get started. You need to locate the mortgage calculator template under the Premium Templates section.

在下一页上，您将看到许多预制模板，可帮助您快速入门。 您需要在“高级模板”部分下找到抵押计算器模板。

You will notice that there are two mortgage calculator templates available: Simple Mortgage Calculator and Advanced Mortgage Calculator.

您将注意到有两个抵押计算器模板可用：简单抵押计算器和高级抵押计算器。

Let’s start with the Simple Mortgage Calculator first.

首先让我们从简单抵押计算器开始。

Place your mouse pointer over the template, and then it will show you two buttons: Create Form and Preview.

将鼠标指针放在模板上，然后它将向您显示两个按钮：“创建表单”和“预览”。

You need to click on the ‘Create Form’ button. This will bring up up a popup window where you need to add a name and description, and then click on the ‘Create’ button.

您需要点击“创建表单”按钮。 这将弹出一个弹出窗口，您需要在其中添加名称和描述，然后单击“创建”按钮。

The plugin will now load the Formidable Forms editor interface with your selected simple mortgage form calculator template.

插件现在将使用您选择的简单抵押表格计算器模板加载“强大表格”编辑器界面。

From here you can simply point and click to customize each form field as needed.

在这里，您只需指向并单击即可根据需要自定义每个表单字段。

For example, you can change the field label and default value for the Mortgage Amount field.

例如，您可以更改“抵押金额”字段的字段标签和默认值。

However, you need to be careful about the last field ‘Monthly Payment’ because it includes the calculation formula as the default value.

但是，您需要注意最后一个字段“按月付款”，因为它包括计算公式作为默认值。

If you are not a calculation expert, you need to leave it unchanged.

如果您不是计算专家，则需要保持不变。

After reviewing all your form fields, click on the Update button at the top right corner of the screen. After that you can click on the Close icon to exit the form editor.

查看完所有表单字段后，单击屏幕右上角的“更新”按钮。 之后，您可以单击“关闭”图标以退出表单编辑器。

Your simple mortgage calculator is now ready. The next step is to add it to a page or post where you want to show the calculator.

您的简单抵押贷款计算器现已准备就绪。 下一步是将其添加到要显示计算器的页面或帖子中。

Simply create a new page/post or open an existing one to add the mortgage calculator. On your page editor, click on the ‘Add New Block’ icon, and then select Formidable Forms Gutenberg block.

只需创建一个新页面/帖子或打开一个现有页面/帖子即可添加抵押计算器。 在页面编辑器上，单击“添加新块”图标，然后选择“强大表单Gutenberg块” 。

After that, you can see the Formidable Forms block added to your page editor.

之后，您可以看到“强大表单”块已添加到页面编辑器中。

Next, you need to select the Simple Mortgage Calculator form in the dropdown option, and WordPress will load the form automatically.

接下来，您需要在下拉选项中选择“简单抵押计算器”表格，WordPress将自动加载该表格。

After that, you can publish or update your page, and then preview it to see how the simple mortgage calculator works.

之后，您可以发布或更新页面，然后进行预览以查看简单抵押计算器的工作方式。

For example, here is how it looks on our demo website.

例如，这是在我们的演示网站上的外观。

在WordPress中创建高级抵押贷款计算器 (Creating an Advanced Mortgage Calculator in WordPress)

The simple mortgage calculator shown above is good for basic mortgage calculation. However, if you want to calculate taxes, insurance payments, PMI, loan to value ratio, etc, then you will need an advanced mortgage calculator for your real estate website.

上面显示的简单抵押贷款计算器非常适合基本抵押贷款计算。 但是，如果您要计算税收，保险金，PMI，贷款对价值比率等，那么您将需要针对房地产网站的高级抵押贷款计算器。

With Formidable Forms, making an advanced mortgage calculator is also a quick and straightforward job.

使用强大的表单，制作高级抵押贷款计算器也是一项快速而直接的工作。

First, you need to visit Formidable » Forms page and click on the Create New button to add a new form.

首先，您需要访问Formidable»Forms页面，然后单击Create New按钮添加一个新表单。

After that, take your mouse over the Advanced Mortgage Calculator template and click on the Create Form button.

之后，将鼠标移到高级抵押贷款计算器模板上，然后单击创建表单按钮。

Next, WordPress will open a popup window where you can enter a name and description for your form and then click on the ‘Create’ button.

接下来，WordPress将打开一个弹出窗口，您可以在其中输入表单的名称和描述，然后单击“创建”按钮。

Now you can customize each form field by clicking on it.

现在，您可以通过单击自定义每个表单字段。

When you click a field, the Field Options will appear in the left column. From there, you can change the field label, default value, etc.

当您单击一个字段时，字段选项将出现在左列中。 从那里，您可以更改字段标签，默认值等。

You can review and edit the Advanced Options of Financial Analysis fields. However, if you don’t know the calculation formulas then its best to leave them untouched.

您可以查看和编辑“财务分析”的“高级选项”字段。 但是，如果您不知道计算公式，则最好不要改动它们。

Once you are done, click on the Update button at the top right corner, and then click the Close icon.

完成后，单击右上角的“更新”按钮，然后单击“关闭”图标。

Your advanced mortgage calculator form is ready; you can now add it your WordPress posts, pages, sidebars, or property listing pages

您的高级抵押贷款计算器表格已准备就绪； 您现在可以将其添加到WordPress帖子，页面，侧边栏或属性列表页面

On your page editor, click on the ‘Add New Block’ icon and then select Formidable Forms block.

在页面编辑器上，单击“添加新块”图标，然后选择“强大表单”块。

Simply edit a post, page, or listing and add the Formidable Forms block to your content editor.

只需编辑帖子，页面或列表，然后将“强大表单”块添加到内容编辑器即可。

From the block settings, select the Advanced Mortgage Calculator form that you created earlier. After that, WordPress will automatically load the mortgage calculator on the page editor.

从块设置中，选择您先前创建的“高级抵押贷款计算器”表单。 之后，WordPress将自动在页面编辑器中加载抵押计算器。

Now you can publish or update your page and preview it to see how your mortgage calculator looks. Here is how the Formidable Forms advanced mortgage calculator looks on our demo website.

现在，您可以发布或更新页面并进行预览，以查看抵押计算器的外观。 这是“强大的表格”高级抵押贷款计算器在我们的演示网站上的外观。

As shown in the screenshot above, the Advanced Mortgage Calculator lets your users enter the home value, loan information including amount, interest rate, amortization schedule, annual taxes, insurance, and PMI.

如上面的屏幕截图所示，高级抵押贷款计算器可让您的用户输入房屋价值，贷款信息，包括金额，利率，摊销时间表，年税，保险和PMI。

The plugin will then calculate the data and display monthly payments, duration, and other information.

然后，该插件将计算数据并显示每月付款，期限和其他信息。

We hope this article helped you learn how to add a mortgage calculator in WordPress. You may also want to see our list of the best email marketing services and best business phone services for small business.

我们希望本文能帮助您学习如何在WordPress中添加抵押计算器。 您可能还希望查看我们针对小型企业的最佳电子邮件营销服务和最佳商务电话服务列表。

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

如果您喜欢这篇文章，请订阅我们的YouTube频道 WordPress视频教程。 您也可以在Twitter和Facebook上找到我们。

翻译自: https://www.wpbeginner.com/plugins/how-to-add-a-mortgage-calculator-in-wordpress/