The Half Map block puts a filterable listings grid beside a live map. The two panes share one search form, so they can never disagree: whatever narrows the list narrows the map at the same moment.
It is the layout most portal style sites use for their main search page, and it is the only block with a draw an area tool.
What you can set
Map side puts the map on the right or the left, defaulting to the right. Height is any CSS length and defaults to 100vh, one full screen.
Search fields chooses which filters the bar carries, and Search fields per row lays them out 3, 4, 5 or 6 across, defaulting to 3, which is narrower than the other blocks because the bar sits over half the width.
The initial filter accepts every searchable value, the same set as the Property List block, so the block can be pre-constrained to a city or a property type for a landing page.
Drawing an area
Visitors can trace a shape on the map with the Draw area button and see only the listings inside it. Clicking the starting point again closes the shape, and Clear area removes it.
The drawn shape behaves like any other filter. It travels with the search form, so the list and the map both honour it, and combining it with a price range or a bedroom count works as expected.
The drawn shape is not something you can preset in the editor. Neither are the map bounds. Both are outputs of what the visitor does on the map, which is why they do not appear as options on the block.
On phones
A split screen does not work at phone width, so the block shows a List and Map toggle instead and gives whichever is selected the full width. The map resizes itself correctly when revealed, and the filter continues to apply to both.
As a shortcode
[mlsimport_half_map city="Miami" map_side="left" height="80vh"]In the block editor and Elementor
In the block editor, add Half Map from the MLSImport group. The initial filter, the map side, the height and the search bar options are in the sidebar inspector.
In Elementor, drag Half Map from MLSImport Widgets, with the same options on the Content tab.
Give the block a full width container with no sidebar. At two thirds of a page width the split leaves each pane too narrow to be useful, and the map ends up showing more base map than listings.
If it does not work
- The map is blank or grey. Tiles are not loading. The free tile server is rate limited under load, so add a MapBox key in the Maps design settings.
- Listings show in the list but not as pins. Those listings have no coordinates. The map can only plot what the MLS supplied a latitude and longitude for.
- The map is a thin strip. The height is being constrained by the container. Set Height explicitly, and check the theme is not limiting the section height.
- The two panes disagree. That is a caching artefact, since both read one form. Clear any page cache and reload.
Frequently asked questions
Does the map reload the listings as I pan?
Yes. The map loads the listings for the area you are looking at, so panning and zooming brings in the pins for the new view. The drawn area, when one is set, still applies on top of that.
Why are some pins numbered bubbles rather than prices?
Those are clusters, which group nearby listings until you zoom past the cut over level. Both the switch and the level are in the Maps design settings.
Can I use a Half Map as my results page?
Yes. Set the search form’s Results page URL to the page holding it, and the block picks the criteria up on load in the same way the Search Results block does.
Can the map be on top and the list below?
Not as an option. Map side offers left and right only. A stacked layout is a map block above a list block, which is two separate blocks and loses the shared filter.
Related
- The Map with Listings block
- The Property List block
- The Search Results block
- The Design Settings page
Send us the page and we will check the map settings and the coordinates behind it.