All Collections
Search Form Settings
Toggling between the map and list in mobile view
Toggling between the map and list in mobile view
Michael Fatica avatar
Written by Michael Fatica
Updated over a week ago

In mobile views, sometimes it is easier for users to interact with only the map, or only the list at one time. This allows for a dedicated map or list display, without the sometimes cumbersome interaction between user scroll behavior and the map & list combined on the same screen.

One solution is to use the Toggle Map & Directory control as shown below:

This displays a toggle switch that allows the user to switch between the map and list when in mobile view. Notice the "Styles" selection controls that this switch is only displayed in mobile device widths.

To use the Toggle Map & Directory control,

  1. In the Interface Builder, click Search Form, then Add Field.

  2. Choose Toggle Map & Directory

  3. Click the Mobile preview button to enable mobile view, which will make the new toggle visible:

  4. Under Layout Settings, we recommend increasing the Mobile Map Height to 500, since the map is no longer competing with the list for vertical space.

This control also allows setting whether the Map or List is displayed by default, via the "Show Map Initially" checkbox, as shown below:

Did this answer your question?