Integrating IDX Broker to your website is done by adding IDX pages and/or widgets to your site. When adding IDX pages, it's recommend to use a wrapper which matches your site's design to your IDX pages. IDX wrappers will work with most CMS solutions with a few exceptions. Websites built on Wix use a combination of HTML5 and AJAX to render the website pages. This means that the actual content of a Wix page is dynamically pulled into the site at runtime. For these reasons, creating a dynamic wrapper for a Wix site may be limited to certain themes. If you are having trouble with your dynamic wrapper for your Wix site there are a few options:
Creating a Wrapper Using Curl/Includes Method
If a dynamic wrapper will not work with your Wix site, you can create a wrapper by using server side includes files. You can view our article here for more information on this method:
https://support.idxbroker.com/support/s/article/curl-includes-wrapper-setup
Contact an IDX Developer Partner
IDX Broker has a partner program with developers who are experts at real estate websites and IDX Broker tools. You can find a developer partner who is familiar with Wix and can create a wrapper for you: https://idxbroker.com/developers/search#wix
Iframing (No Wrapper)
Iframing stands for inline framing and is a method for adding HTML content to your site's pages. If a wrapper cannot be created for your site, or you choose not to use one, you can iframe your IDX pages into your site. An iframe code typically looks like this:
<iframe src="PASTE URL HERE" width="100%" height="100%"></iframe>
You would simply copy the IDX page URL that you want to iframe and add it to the code snippet above. Then, you would add the iframe code to your Wix site. Read this article from Wix for instructions on adding HTML code to your Wix page.
1. Within the Wix site editor, add a widget area to your page using the following steps:
1.1. Click the + Add Elements button in the left hand column.
1.2. Select Embed Code.
1.3. Select Embed HTML under "Popular Embeds"
2. If you're not seeing an HTML Settings prompt on your screen, click on the Enter Code button that appears when you have the embed element selected within the Wix editor.
3. Within the HTML Settings prompt, under the "Add your code here (HTTPS only)" section paste the iframe code with the updated URL.
4. Click the Update or Apply button at the bottom.
5. Position and resize your embedded element within the Wix editor to ensure there's enough space to show the page from your IDX Broker account on your site.
Adding Widgets
Disclaimer:
Please note that due to the way WIX implements code blocks through iframing, certain advanced functionalities of our widgets, including the New widgets and our Map Search widget, may not operate as intended within the WIX website builder. These widgets are designed to function seamlessly on platforms that allow direct code embedding. For optimal performance, we recommend using a platform that supports direct integration for these features.
To add an IDX Broker widget to your Wix site, follow the steps above for creating a code block. However, rather than using the iframe example above, you will use the widget code you see within your account and then paste it into the Wix code block you created. You can read more about how IDX Broker widgets work with our "Creating & Managing Widgets" support article.
Here's example of how the widget code would be presented to your for a legacy widget within your account:
For our newer widgets, you'll instead see the code presented to you like this:
Note: In either case, in order for the widget code to render properly, you will need to ensure the code is wrapped in HTML <p> tags.
Here's an example of the above widget code wrapped with <p> tags:
<p><script charset="UTF-8" type="text/javascript" id="idxwidgetsrc-63311" src="//supportwp.idxbroker.com/idx/carousel.php?widgetid=63311"></script></p>
And here's a screenshot of how that code would look like added within the Wix editor:
Some Considerations
What happens if I use widgets?
- When a user clicks on one of the listing images within a widget the listing detail page may open in a new tab or window without your design. The user can close that tab or window and go back to your main site.
Are there disadvantages to iframing?
- We don't generally recommend framing to clients if they can avoid it. The primary reason for this is that search engines can have issues and the user experience suffers when framing technologies are employed.