Embed iGUIDE

This guide describes how to embed iGUIDE into a listing page.

If you detect that the virtual tour URL for a property in the MLS feed is iGUIDE then you can embed the iGUIDE right in the listing detail page and also provide PDF floor plans.

Detect iGUIDEs

You can detect iGUIDE just from looking at the URL of a virtual tour. If the domain name in the URL is either youriguide.com or unbranded.youriguide.com, the tour is iGUIDE.

Embed the iGUIDE

  1. You will need to parse the virtual tour URL to extract the iGUIDE ID, once you detected the "youriguide.com" domain. These are the domains or subdomains that you can expect to see from us: youriguide.com and unbranded.youriguide.com.

    iGUIDE ID is the first segment of the URL path. For example:

    The general form of the URL is: https://{DOMAIN}/{IGUIDE-ID}/{SUB_PATH}?{QUERY}?{FRAGMENT}? where "?" denotes an optional component. JS regexp that can be used to parse the URL and extract iGUIDE ID is ^https://(unbranded\.)?youriguide.com/(?<iguideId>[^/?#]+)([/?#].*)?$.

  2. You can then construct the RESO endpoint from it as https://youriguide.com/api-docs-sample/reso/autofill and fetch links to PDF floor plans and construct URL for embedding. The endpoint is documented at Lightweight Autofill Endpoint. For example, the PDF floor plan URL for imperial units will be https://youriguide.com/api-docs-sample/doc/floorplan_imperial_en.pdf.

  3. To get a custom embed code for iGUIDE, it is recommended taking a look at the iGUIDE Embedding Tool: https://manage.youriguide.com/embed/api-docs-sample

The embedding tool allows a lot of flexibility in customization of iGUIDE, check the Advanced options. For example, you can show only 3D tour and hide gallery, video, details tabs because you will probably already have that info elsewhere on the listing page. You will probably want to use the unbranded iGUIDE, so that agent banner does not get in the way. Another option you may want is to turn off the top menu bar altogether. On a single listing page, enabling the "Automatically Start" option maybe a good idea. Once you construct the embed code that work the way you want, you will only need to swap the iGUIDE ID for re-use.

After you embed an iGUIDE in your web application, you can take the next step and provide a deeper integration using our Viewer Javascript API. For more details see Viewer API.

Last Updated: