Inserting and Customizing the Website Listing Module iFrame Script (Advanced)

Use the iFrame script for placing the Listing Module on your own website to show your available unit rentals.

Samuel avatar
Written by Samuel
Updated over a week ago

Overview

If you already have your own website and want to show your DoorLoop available unit listings on it, you can by embedding an iFrame Listing Module script to your site. This isn't for novices, however, and we recommend that you have someone with HTML knowledge help you with this. If you're comfortable with HTML script, then keep on reading.

Note that if you want to embed an iFrame script to list your rentals on your own website, you will need to be a Pro or Premium account holder to get it. Reach out to support and we can supply you with the script. Starter plans please upgrade if you want this feature.

To summarize, these instructions will be used to embed a custom iFrame code that shows your available rentals on your own website. This will allow prospects to view the available units and also apply for them by filling out your online rental application.


The Steps

Inserting the iFrame script into your website

  1. Reach out to our support team in order to get the iFrame code.

  2. Once you get the code, you'll want to copy and paste it to one of the pages on your website. Please refer to the video above as an example of how to paste this code into your website. (Wordpress and Wix examples)

  3. After pasting the code, you'll need to enter the correct company_id that is associated with your DoorLoop account.

  4. You can find this by clicking Settings in the main menu and then clicking the Listing Syndication button under the Company section.

  5. Scroll down to the bottom and look at the Rental Listings URL code. You'll want to copy the portion of the code at the end, after "other/" so it'll look a little something like this: 635845ce14a3a0148a4ea42f

  6. Take that code and paste it into the iFrame script in the section labeled "data-company_id", as shown in this example: data-company_id="635845ce14a3a0148a4ea42f"

  7. After you do that, your listings from DoorLoop will start appearing on your website.


Customizing the Listing Module

  1. You may find that you want to customize the look of the iFrame a bit and you can do that with a few simple little tweaks. You'll be able to customize certain parts of the code to your specifications. Below are the parts of the code you can edit:

    • data-width: this changes the width of the iFrame. The default is 100%, which means the width will resize on its own based on the browser width.

    • data-height: this changes the height of the iFrame. Increase this number to make the iFrame taller.

    • data-background: this changes the background color of the iFrame only. You'll need to use a hex code here to change the color. For example, if you want the background to be red, you would use #FF0000.

  2. If you're editing the iFrame with a WYSIWYG editor, you may not need to edit any of the code itself.

And that's pretty much it with the Listing Module. Again, this is for advanced users so please make sure you understand the process before making any changes.

Did this answer your question?