Embed Codes
Generate and customize embed codes for your website.
Basic Usage
The simplest way to embed a calculator is with the basic script tag:
html•Basic embed code
<!-- MortgageMate Affordability Calculator -->
<script src="https://mortgagemate.app/embed.js" async></script>
<div data-mortgagemate="affordability" data-key="YOUR_EMBED_KEY"></div>Replace YOUR_EMBED_KEY
Your unique embed key is provided in your dashboard. It authorizes the calculator to run on your registered domain.
Getting Your Embed Code
1
Go to Embed Codes
From your dashboard sidebar, click "Embed Codes".
2
Select Your Domain
Choose the domain you want to generate an embed code for.
3
Select a Calculator
Pick which calculator you want to embed from the dropdown.
4
Copy the Code
Click the copy button to copy the complete embed code to your clipboard.
Available Calculators
Use the data-mortgagemate attribute to specify which calculator to load:
| Value | Calculator |
|---|---|
affordability | Affordability Calculator |
mortgage-payment | Mortgage Payment Calculator |
closing-costs | Closing Costs Calculator |
rent-vs-buy | Rent vs Buy Calculator |
dscr | DSCR Calculator |
heloc | HELOC Calculator |
net-proceeds | Net Proceeds Calculator |
refinance | Refinance Calculator |
buydown | Buydown Calculator |
Multiple Calculators on One Page
To embed multiple calculators, add additional div elements with different calculator types. You only need to include the script once:
html•Multiple calculators on one page
<!-- MortgageMate Affordability Calculator -->
<script src="https://mortgagemate.app/embed.js" async></script>
<div data-mortgagemate="affordability" data-key="YOUR_EMBED_KEY"></div>
<!-- MortgageMate Mortgage Payment Calculator -->
<div data-mortgagemate="mortgage-payment" data-key="YOUR_EMBED_KEY"></div>Configuration Attributes
| Attribute | Required | Description |
|---|---|---|
data-mortgagemate | Yes | Which calculator to display (e.g., "affordability") |
data-key | Yes | Your unique embed key from the dashboard |
Ready to get your embed code?
Generate your personalized embed code from the dashboard.
Go to Embed Codes