Skip to main content
Housing Market GroupHousing Market GroupTutorials

How to Add a Housing Market Widget to Your Website

Tutorial 152 of 181 · 1 min 57 s

Open the product

Once a widget is designed, putting it on your website takes one short piece of code, pasted once. This tutorial opens the Publish tab of a live widget, copies the code, shows where to paste it in Wix, Squarespace, Webflow, Shopify, WordPress or a plain HTML page, and then pastes it into the Properties page of a demonstration website. The page shows your own properties straight away, with the filters and the property window your visitors will use.

In this tutorial you will learn

  • Where to find the code for a widget
  • How to copy it and where to paste it in common website builders
  • What to do if your website builder blocks scripts (the iframe code)
  • What your visitors see once the code is on the page

Follow along: the steps

  1. This is your Housing Market CRM dashboard.
  2. Open Properties in the left menu.
  3. Click Website widgets.
  4. Open Homepage listings.
  5. Open the Publish tab.
  6. This short code is all your website needs. It is two lines: the script and the place for the widget.
  7. Click Copy code.
  8. It is copied to your clipboard.
  9. Every website builder has its own place for custom code.
  10. Wix: Add Elements, Embed Code, Embed HTML.
  11. Squarespace: add a Code block.
  12. Webflow: add an Embed element.
  13. On a plain HTML page, paste it inside the body.
  14. If your builder removes scripts, use the iframe code instead. It shows the same widget.
  15. Here is the Properties page of a website. Open the page where the widget should go.
  16. Click in the page where the widget should appear…
  17. …and paste the code.
  18. Save the page.
  19. Your properties are on the page, with their photos and prices.
  20. Visitors can filter by sale or rent, price, type, bedrooms and location.
  21. Click a property to open its details in a window, without leaving your site.
  22. Visitors see the photos, the description and a form to enquire.
  23. Change the design in the CRM and this page follows. No new code to paste.