The Results widget should be placed on your designated "results" page in your website as part of the foundation page setup, and will display the properties resulting from a search.
Ths widget is mobile- and container-responsive. The layout will adjust for device sizes and will and fit into most spaces on a webpage.
Only 1 x Google map is permitted per page.
Your choice of a 'map' on a page can be from either the results widget OR the map display widget.
If you are displaying an additional Google map on the same page (not using Buying Buddy widgets) then it should be removed.
This widget is mobile responsive and will expand to fill any container / space made available in your website page design.
Size
- Minimum width: Designed for mobile
- Maximum width: Unlimited
Colors and Background
- Widget Themes can be used to apply predefined, or your own, color schemes.
- Uses 'Widget Background' color from the applied widget theme
Pagination
When showing a grid of properties (either sidebar or when map is hidden) the pagination of results (i.e. how many you see and how many return when you click "More") is handled automatically.
Consequently the filter parameter for "limit" is ignored.
Presentation Modes
There are 3 layouts for presenting results:
- A list of the properties displayed in a grid layout (this is the initial default view)
- A split screen that shows the map and properties.
- Just the map.
Controls
The Results Widget can be show full screen using the full-screen button in the header section.
Parameters
1. id='MBBv3_ListingResults'
Examples:
<div id="MBBv3_ListingResults"></div>
[mbb_widget id="MBBv3_ListingResults"]
Search Filter
See "Results Widget as a Display Widget" for details on how to use a Filter with the Results widget to make make it function as a Display Widget.
2. Initial Results View (split-screen or properties?)
The default view presents results as a list of properties in the grid layout - the map is hidden.
The user can use the Show Map button to see the split screen.
To show the map (split screen) by default when the results loads, use the "tab" filter option as follows:
- filter="tab:map"
For example:
<div id="MBBv3_ListingResults" filter="tab:map"></div>
[mbb_widget id="MBBv3ListingResults" filter="tab:map"]
3. Set the Initial Map View Center Point and Zoom
Choose the center point and zoom level you want for the initial map view.
This filter requires latitude and longitude values so use the LAC Wizard to create these filter values.
Remember the view of the map does not affect the result, just the view.
4. Remove the Menu and Save Search button
- filter="header-menu:false" This will hide the 'menu' icon and the 'save-search' button in the header.
Flow
Below is a visual example of a search sequence on your website:
- A Search will go to your "results" page and show results using the Results Widget.
- Clicking on "View Details" for a property will go to your "details" page and show property details using the Property Details Widget
