Showcase IDX offers a number of widgets to help customize your site and get your clients the information they need. In this section, we'll highlight what each of those widgets does and how to make the best use of them. You can also find more information a video tutorial of these instructions.
To start, navigate to the SHORTCODES section in the Settings of your admin dashboard (admin.showcaseidx.com).
For all widgets, the shortcode is generated at the top of the page automatically as you adjust the widget. Click the blue "Copy" button and you can simply paste the shortcode directly onto your WP page.
The search widget is a great way to introduce your users to the power of the Showcase IDX search system in a compact, easy-to-customize widget that goes great on your homepage, and can be used in the Wordpress Sidebar.
The powerful search widget includes various customization options you can use to style it to your exact specifications, including the ability to attach SAVED SEARCHES to the widget so that certain parameters are sent ahead to the search page: if your site focuses on condos, you can attach a Condo-centric saved search to the widget to make sure your users only get condos returned no matter what they choose in the filters.
AVAILABLE CUSTOMIZATION OPTIONS
Apply Search - Apply a saved search to the search widget, ensuring that pre-determined filters are send to the search along with whatever is selected in the widget itself (useful if you plan on hiding any of the filter options so only certain properties are shown)
Add Margin to Form / Add Padding to Form - Particularly useful when using the widget in the sidebar, these two options will allow you to assign a pixel-value for margin and padding to the form to make sure it looks perfect when in responsive containers
Add Corner Radius to Form - Perfect for when you like those rounded edges; will add rounded corners to the buttons and the entire form, allowing for round-button styles
Include Advanced Search - Adds the Advanced Search filters drop-down box to the form, allowing for filtering via advanced features such as Pool and Pets
Exclude Beds/Baths/Types/Price/Locations - Customize exactly what options are available for the search widget. Only deal with luxury listings? Get rid of the price box so only your selected price range is available for users. Want just a search button (for instance when you have a specific saved search tied to the widget)? Exclude everything and see just the blue search button (which you can customize the text of in the following option). Pick and choose which ones are best for your site
Customize Search Button Text - Replace the magnifying glass with custom text of your own.
Once everything is set as you'd like it, you can preview the widget at the very bottom of the screen to get a sense of what it will look like when added to your site.
You can also have the search widget auto-submit when a location is entered. All you need to do is remove the price, beds, baths and types fields! Here is a quick demonstration of what that would look like.
Search Button Widget
The search button widget gives you the ability to create a button that can be linked to any saved search. Additionally, you can change the text on the button to whatever you like. Clicking the button sends the website user to the results for the assigned saved search. If you don't apply a search to the button, it will just redirect the user to your default search page.
We see agents using this for adding links to search results from neighborhood pages and even their homepage.
Search Results Count Widget
The Search Results Count is a simple widget that will display the number of results for any saved search. If you want to add some summary numbers to your site that reflect the number of single family homes in a location, or condos, or for rent listings, you can do this. The widget generates default text that you can use CSS or your theme to change its size and style.
You can have it as just a number or you can easily create a link to the saved search results. You can also choose if you want the results to display in the current tab/window or a new tab/window. It's a pretty simple widget but can be really powerful when used on a community page or on your homepage.
Get creative with it and show your visitors how many listings you have on your website, or show many niche listings are available. This is a BETA version of this widget and might take some advanced development to make it look good on your website.
The map widget works best when paired with a saved search. It makes for a great semi-interactive header for community pages (the map pins work just like they do on the default search), and can be a nice addition to pages where specific areas are highlighted.
AVAILABLE CUSTOMIZATION OPTIONS
Apply Search - Works similarly to the search widget function of the same name, this will allow you to choose from a pre-made saved search in your search library to display listings and the map from that search. This works even with polygon searches as well, allowing you to draw a polygon in a saved search and have it show up in the map widget. If you do NOT apply a search to the map widget, it will inherit the settings from your SETTINGS > SEARCH map (the default search page setup).
Set Height - Set the height in pixels for the map. It is responsive and will adjust the width to whatever container you put it into
Exclude Search In Map/Zoom/Draw Area(polygon tool)/Satellite Buttons - Just want a beautiful map and nothing else? Exclude all the map tools from the map. Each button is independent, meaning you can allow the satellite button while hiding everything else, or however you'd prefer
Once everything is set up as you'd like, you can see a preview of the map at the bottom of the page.
The Sign-In widget allows you to have a registration and sign-in portal for Showcase IDX anywhere on your site. Want to have your own customized sign-in modals or landing pages? Use this widget to add the same functionality you would find by signing into the plugin from any other place you have the Showcase IDX plugin. Fully responsive and modal-capable.
The Contact Widget allows you to mimic the "CONTACT US!" call to action button functionality anywhere on your site. When a user fills out the form and submits it, you will get an e-mail to your main account e-mail with the contents of the widget, allowing you the ability to quickly follow-up with your user's questions. Fully responsive and modal-ready! The Contact widget also serves as a lead routing source, allowing you to send submissions of this form to a specific e-mail address using the SETTINGS > LEAD ROUTING settings in your admin dashboard.
The Market Value widget works in a similar way to the Contact Us widget, allowing users to fill in a form that will be sent directly to your Showcase IDX associated e-mail address, with all the relevant data available to you for quick responses. The Market-Value widget can be used a completely separate lead-routing source, as well, allowing you to send the submissions to a different e-mail address utilizing the Showcase IDX lead routing system.
We’ve given our customers the ability to take the IDX navigation links out of the main search container. You can add a separate IDX navigation links to a top bar on your website to give a fully integrated user experience on your WordPress website that is more like what you’d see on very expensive custom websites or portals like Zillow and Realtor.com. You want the consumers on your site to always know where to find their search dashboard, listings, and searches. So by placing the links in a top bar above your main header, they can always be accessible. This gives you a way to have people sign up from any page on your website. It is designed to automatically display the signup/in modal over your content on any page! By putting the link in the navigation top bar it significantly reduces the visual clutter in the search area. It gives a cleaner look that dramatically improves your website’s user experience.
How do I do it?
- Adjust your widget with the available options.
- Copy the Shortcode
- Go to your theme in your WordPress admin, and find if they allow a configurable top bar to your navigation header. This might require a bit of custom coding if your theme doesn’t support it, but many do at this point. Follow the instructions from your theme to add content to your top bar.
- Go back to the Navigation Links page in the Agent Admin and grab the CSS snippet that is on that page. This will hide the default (in-app) links so you’re only showing one set of links. It doesn’t look great if you keep both links, we highly recommend against keeping them both.
- Paste this CSS into your Custom CSS field Settings>Design or in your theme. You should be done!
Heres a quick video of those custom options in action. This website is using ARK theme.
But wait, there’s more!
You can also individually style each of the links. So if you want to make a more prominent button out of the Sign Up link you can! The class names are:
- sidx-header-link-search (main search)
- sidx-header-link-dashboard (dashboard)
- sidx-header-link-listings (saved listings)
- sidx-header-link-searches (subscribed searches)
- sidx-header-link-profile (sign in / profile)