
How to create a map
Maps
A Map section puts your places on a map: shops, venues, sights or offices. Each place gets a page with photos, directions and contact buttons, and your users see how far away it is.
Add a Map section
In My App, Structure, click Add a section at the end of the Menu… then search for map to find the Map card.
Point at it to see the screens it adds: the list, and a place's page. Click Add.
Name the section. Leave the layout as it is: you can change it later, in Edit the design. Then click Add.
It joins your menu, and a Map widget joins your Home.
Add a place
Open the section: the List of locations holds your places. Click Edit the content… then Create a point.
Type the place and pick a suggestion… its name, address and coordinates follow, and the pin lands on the map.
Zoom in and drag the pin to the exact spot if needed.
Add a photo and a text with Add an element, as in an article. The first photo becomes the place's thumbnail.
In Info, a phone number and an email become buttons on the place's page, and Other information links to a website.
Icon style sets the pin: a shape and its color, or an icon of your own. A white PNG takes the color you pick… and Point thumbnail turns the place's photo into its pin.
Then publish it, now or later.
The map and the list
In Edit the design, Visual shows each place with a big photo and its distance… Enriched, a compact list… and Split Enriched, the map above the list.
With Show map, your users switch to the map: each place has its pin, and they see where they are.
Tapping a pin opens its card: that's Show summary list… and Enable search in the zone adds a button to look for places where the map is.
The place's page
A place's page shows its address and distance, then buttons to get directions, write, call or visit its website.
Its design is ToolBar Up Classic, or Up Banner, with the photo on top.
The Toolbar picks the actions on a place: Share, Favorites and Comments.
Sorting and routes
In the section's settings, places are sorted by distance, and a maximum distance hides the farther ones.
Routes draws the lines and areas of a KML file over your map, in the file's own colors.
Before you publish
Distances need your users' position: check the location permissions in the Privacy center. As the page says, they reach users with your app's next version on the stores.
Your users choose miles or kilometers in your Settings section.
Places are live as soon as they're published; a new section reaches your app once you publish it, with Publish my project.
Related videos










Design