Custom Forms Tutorial

You can enter the URL where you'd like to redirect your leads after submitting the form. If none is specified, they'll stay in the same page.

You can customize the CSS. After you've finished, just click on the "Save Changes" button.

Click on the "Copy" button to copy your Custom Form to your clipboard. Now you can paste it in place of the original widget.

After your leads submit the form, you'll receive an email like the following:

The information will also be added to the lead notes.

Enter a title for your contact formand click on the "Save Title" button.

You can customize the CSS. The default contact form displays one field for the full name, but this input can be hidden and display the inputs for the first name and the last name. For this example, we will add some styles:

After you've finished, just click on the "Save Changes" button.

Click on the "Copy Code" button to copy your Contact Form to your clipboard.

For this example, we will paste the code in the Details page Sub-headers:

Log into your IDX broker account and access this page: https://middleware.idxbroker.com/mgmt/subheaders.php

Then, click on the "Pages" tab and select the "Details" page.

Turn the WYSIWYG off.

You may find that there is or isn't code there. You should never remove any codes you have there since you might lose styles and customizations if you remove them. Paste the widget along with the other codes. You can paste it in the beginning or in the end of that section, but never in the middle of it.

Click on Save Changes

As you can see, the form is added at the beginning of the details page.

Lets move the position of the element before the map. To do this, we will add this piece of code to the sub-header (this is just an example and the element can be named different in your site):

                        <script type="text/javascript">
                            window.onload = function() { 
                                idx('#details-container').appendTo(idx('#IDX-details-row-content'));
                            }
                        <script>
                        

Click on Save Changes and now you'll see the contact form in its new position.