MortgageQuote Guides
  • MortgageQuote's Resources
  • GUIDES
    • MQ's Basics
      • Signing Up
      • Choosing a Plan
      • Adding Team Members
      • Embedding Our Widgets
    • Embedding Widgets
    • Integrations
      • Zoho CRM
      • HubSpot CRM
    • Settings
      • Account
      • Company
      • Logo
      • Your Privacy Policy Link
      • Widget Contact Preference
      • Email Recipients
      • Team
      • Billing
      • Account Security
  • Products
    • Widgets
      • Mortgage Quoting System
      • MortgageCTA
    • My MortgageQuote
  • Lenders
    • Mortgage Lender Panel
    • Bridging Lender Panel
  • Other
    • Changelog
      • January 2024
      • February 2024
      • October 2024
      • November 2024
Powered by GitBook
On this page
  • How it works
  • Embedding into your website
  • Generating the code snippet
  • Selecting a quote type
  • Customisation
  • Customising the widget
  • Transparent colours
  • Hiding lender details
  • Adding your privacy policy link
  • Changing the callback contact preference
  • Changing the check eligibility link
  • Lender panel
  • Emails
  • 1. Mortgage plans email
  • 2. Check eligibility email
  • 3. Client report email
  1. Products
  2. Widgets

Mortgage Quoting System

Embed a highly customisable mortgage quoting system into your website.

PreviousWidgetsNextMortgageCTA

Last updated 6 months ago

Our Mortgage Quoting System widget is our flagship product. This enables you to add mortgage quoting into your website to allow for instant, tailored mortgage quotes for your visitors/clients.

Our goal for this system is to enable you with high-quality leads, engage your website visitors with interactive features to increase their time on site, and provide them with access to a wide range of mortgage information.

How it works

Our mortgage quoting system will be embedded into your site to allow your visitors to get quick, indicative mortgage quotes. Firstly, they will be asked a variety of questions in order for our system search for plans which suits their requirements.

After a visitor has answered all the questions, they are prompt to enter their name, email address and phone number as well as accept a privacy policy and contact preferences to keep compliance happy.

Our system compares the questions answered with over 10,000+ mortgage products from 90+ lenders and outputs up to 10 of the top plans that best suits the client.

During this search, the client's details are added to the a micro CRM which allows you to view the quote details. As well as this, you will also receive a client report on the hour which contains a csv file with a list of newly completed quotes.

Embedding into your website

Embedding the quote widget into your website is straightforward. Simply generate the code snippet and insert it into the HTML of your website where you want the widget to appear. Be sure to test the widget to ensure it functions correctly and blends visually with your site's design. Adjustments can be made at any time via the customisation options to better fit your requirements.

Generating the code snippet

There are two ways you can generate the code for this widget. Once logged in...

The code will look similar to this.

<script
    async
    id="mortgageplanlist"
    src="https://frontend.mortgage-quote.me/calculators/mq/mq.js?id=123456789">
</script>

Selecting a quote type

To focus the quoting system on either residential or buy-to-let mortgages, use the "Select a Quote Type" dropdown in each code snippet to choose the mortgage type.

Customisation

The quoting system is highly customisable, allowing you to tailor it to your brand and website. Choose from a range of colours, fonts, and layouts to ensure that it seamlessly integrates with your existing website design.

Customising the widget

On this page you are able to customise a variety of elements on the quote widget, for example the colours, font size, border radius, shadows etc. Once you have settled on the styles, don't forget to click the "Save Changes" button. The styling should update on the next refresh of the widget on the website the widget is embedded into.

Transparent colours

To make a colour transparent, click on it to open the colour picker. In the hex colour input box, click the black-and-white square icon on the right to toggle transparency on or off.

Hiding lender details

If you require the lender details to be hidden, find the "General" section in the customisation and then uncheck the "Show Lender Details" option. This will hide all lender details for clients but you will still be able to view which lender each plan corresponds to.

Adding your privacy policy link

To add a link to your privacy policy on the customer details form, find the Edit Privacy Policy Text option and click the "Edit" button.

...This will open a new tab and take you to the Your Privacy Policy Link settings page. Here you can edit the text of the privacy policy statement and add in necessary links. When you are happy with the text, click the "Update Privacy Policy Link" button to save your changes.

Once this has been updated, the privacy policy text will appear on the customer details form.

Changing the callback contact preference

The default way the system works is the user needs to tick a checkbox in order opt-in to be contacted. This can be changed. You can decide if it functions as an opt-in or opt-out checkbox. Or you can replace the checkbox for just a line of text.

Opt-in / Opt-out checkbox

To select if your system displays an opt-in or opt-out checkbox for contact preferences, find the Contact Checkbox Opt-In option and toggle it to either be enabled or disabled.

Enabled - Sets the callback of the quote to "No" unless the checkbox is ticked. Disabled - Sets the callback of the quote to "Yes" unless the checkbox is ticked.

Replacing the checkbox for text

Instead of displaying a checkbox, you can set it to just show text. In this case, the callback will be set depending on the opt-in option selected.

In order to replace this checkbox with text, find the Replace Contact Checkbox With Text option and click the "Edit" button. If the field is left blank, the default checkbox will be shown.

Changing the check eligibility link

When the results are shown, each plan has a "Check Eligibility" button. This displays a sidebar and allows the user to enter their email address to request an eligibility check/callback from you. This button can be changed to a link instead. e.g. A contact page.

You can choose to open this link in the same tab or in a new tab.

This setting will change the preference on all widgets with contact options.

Linking to a page

To link to a page, enter the the web page you wish to send the user to. You will most likely need to prefix the URL with a backslash if you are linking to an internal page.

Example

Linking to an anchor tag

In order to link to an anchor tag, prefix a hashtag to the Id name of the HTML section.

Example

<div id="get-in-touch">
    <!-- Get in touch -->
</div>

If this section is on the same page as the quoting system, you'd type in the input box: #get-in-touch If this section is on another page, you'd type in the input box: /your-page-name#get-in-touch

Lender panel

Once on this page, to deselect a lender, simply click on a it's corresponding logo and the box it is held in should turn grey and a cross will appear in the top right hand side instead of the green tick.

After you're happy with your lender panel selection, click the "Save Lenders" button.

Emails

The are 3 emails that relate to the Mortgage Quoting System. These being:

1. Mortgage plans email

The mortgage plans email is received by the client and is only sent if they click the "Email Plans" button after they have completed a quote. This will send the client a nice email with the plans on it, as well as the contact email you set during setup and your logo if you uploaded one.

2. Check eligibility email

This email contains the clients Name, Email Address, Phone Number, Session Id Customer Id and a list of the questions answered.

3. Client report email

This email contains a csv file of all the quote sessions completed on the hour of the client quoting.

If you're unsure as to how to add the code into the HTML of your website, or need to check if the widgets work with you web platform, view the .

…on the will be a line of code in the code snippet card.

...in the page, find the "View Code" button. A modal should appear with the code inside ready to be copied.

To begin customisation, once logged in, navigate to

This can be achieved by finding the in the settings. If the input is left empty, the default behaviour will remain for the button, however, if any text is entered, the button will be changed to a link.

Internal Page: /your-page-name External Page:

You are able to toggle lenders which appear on the mortgage quotes. In order to do this, once logged in, navigate to .

.

You can see how to change the contact information or upload a logo by .

The check eligibility email is sent to the entered during company setup. However, if are added in the , those addresses take priority. Both of these can be updated in .

The check eligibility email is sent to the entered during company setup. However, if are added in the , those addresses take priority. Both of these can be updated in .

widget embedding guide
dashboard
Quoting Styles
Dashboard > Quoting Styles
Widget Contact Preferences page
https://mortgage-quote.me/contact
Dashboard > Lenders
Click here to learn more about the lenders on our system
visiting the Settings guides
Contact Email
Contact Email Recipients
Email Recipients settings
settings
Contact Email
Admin Email Recipients
Email Recipients settings
settings
View a demo
Mortgage Quoting System questions
The customer details form for the Mortgage Quoting System.
Demo website to demonstrate Mortgage Quoting System results.
Quote details in the MortgageQuote account
Quote widget customisation page
Toggle transparency option
Show lender details option
Edit privacy policy text option
Your Privacy Policy Link settings page
Privacy Policy link on customer details form
Callback contact preference default option
Contact checkbox opt-in option disabled
Replace contact checkbox with text option
Contact Widget Preferences settings page
Lender panel page
Email Plans button
Email plans sidebar
Plans email
Check eligibility button
Check eligibility sidebar
Check eligibility email
Client report email