Map Full-Width + Filter
This is a full-width map display. It will expand to the full size of the container that it’s in.
The Interactive Map widget works best when it’s initialized with filter options to present a curated display of properties.
In this case, we set the container to be the width of the whole page, added 10px padding on the left and right side, and set the map city to Arvada, showing listings with a minimum 3 bedrooms, and the max price to be $500,000. We also set options for the zoom and pan of the map.
Scroll down below the map to see how it’s done.
How It’s Done
The Map Widget (as with all widgets) expands to fill the available space. In this example, the underlying page layout is “full-width” – and as a consequence the map expands to fill the area provided.
For WordPress
[mbb_widget id="MBBv3_InteractiveMap" filter="mls_id:demo+listing_status:active+city:arvada+price_max:500000+bedrooms_total_min:3+limit:10+order:create_dt desc+mapzoom:14+mappos:39.80786414347736 -105.06724486009288"]
For HTML<div id="MBBv3_InteractiveMap" filter="mls_id:demo+listing_status:active+city:arvada+price_max:500000+bedrooms_total_min:3+limit:10+order:create_dt desc+mapzoom:14+mappos:39.80786414347736 -105.06724486009288"></div>