How To: Add A Mortgage Calculator Custom Page To Your kvCORE Website

Copy and paste the entire code below into a new kvCORE Custom Page and you’ll get a mortgage calculator that is mobile responsive. For our Canadian friends, click here…

Note: if you’re installing this on Kunverion/k+, you must be on the broker/admin login, and you’ll want to run the below code through an HTML minifier before pasting into your custom page. This is due to the way the Kunversion text editor adds paragraph tags after line breaks in custom HTML markup. kvCORE users can simply copy and paste the code below.

Too busy or too geeky for you to do? Hire us to install and customize the values for you, remove the kvCORE sidebar widgets to make for a full width calculator, and we can even remove the scroll bar on the calculator! Click here for more info.

Insert the following code into your kvCORE custom page. The code must be entered as HTML.

<h2 class="m-b-2 text-center">Estimate Your Monthly Payment</h2>
<style>iframe{height:2400px;width:100%;border:0}@media (min-width:768px){iframe{height:2260px}}@media (min-width:992px){ iframe{height:2280px}} @media (min-width:1200px){ iframe{height:1280px}}</style>
<iframe src="https://www.mortgagecalculator.org/webmasters/?downpayment=15000&amp;homevalue=300000&amp;loanamount=285000&amp;interestrate=4.5&amp;loanterm=30&amp;propertytax=2400&amp;pmi=1&amp;homeinsurance=1000&amp;monthlyhoa=0"></iframe>

Here is what the mortgage calculator will look like…

Related posts:

How To: Connect Zillow Leads to Kvcore

How To: Create and Install Your Facebook Pixel for Kvcore and Kunversion

How To: Embed YouTube Videos In Kvcore Custom Pages The Right Way

How To: Make Your kvCORE Testimonial Slider Automatically Slide

Posted in How To

4 Comments

  1. Dana Biggs on September 16, 2022 at 4:02 pm

    Is this the full source code? It cuts off the image of the calculator almost immediately when adding it to a custom page.

    Reply
    • Justin Hemker on September 16, 2022 at 7:24 pm

      That is the full source code for the calculator. Depending on your page layout you may have to add some custom styling to size the iframe to fit the page and show the entire content of the calculator without scrollbars. I’ve updated the code above with a bit of styling that should get you pretty close to what you’re looking for.

      Reply
  2. David Knudtson on February 20, 2025 at 3:29 pm

    This is great! I was able to add this to my website easily. Thank you for the resource. I’ve adjusted the numbers the mortgage calculator starts with to better show the average price in my market and better align with the current mortgage rates but I cannot seem to get the loan amount to adjust when the page first loads.

    I also see on your page, that the home price minus the down payment also doesn’t match the loan amount. (once you interact with it, it corrects the data, but I’m particular and do not like the discrepancy.)

    Reply
    • Justin Hemker on February 20, 2025 at 3:43 pm

      Hey David!

      Apologies, there was a typo in the code… loanammount should only have 1 m. The code has been updated accordingly. This will fix your issue.

      Reply

Leave a Comment