Skip to main content

Set Up a Proxi Map on App.Proxi.co

Set Up a Proxi Map on App.Proxi.co - Restaurant Week Example

Written by Melinda Haughey

How to Set Up and Style a Map in Proxi

Link to Video

1. Create a new map and add initial places 0:02

generated-image-at-00:00:02

  • Start from the Proxi backpack page and click Create my first map.

  • Give the map a name (the demo uses a Restaurant Week map).

  • Choose how to populate it:

    • Add places yourself if you’re starting fresh.

    • Or select from an existing collection if you already have one.

  • Add a few example places so the map has content right away.

  • Click Create Map to generate the map and open the editor.

2. Understand the map structure: collections, data, and places 1:48

generated-image-at-00:01:48

  • The map opens centered on the area you selected, with the places you added.

  • On the left, the Data and Places section is where the map’s content lives.

  • Proxi automatically creates a collection when you make a map.

    • A collection is a reusable group of places.

    • It can feed multiple experiences later, like maps or passports.

  • You can rename the collection and also rename what a single place is called.

    • Example: change places to restaurants if that fits your use case.

  • This section is where you:

    • Add places

    • Edit fields

    • Bulk edit records

    • Feature specific places so they stand out on the map

3. Add custom fields to power filtering and styling 5:52

generated-image-at-00:05:52

  • To make markers and filters dynamic, first create custom fields for your places.

  • In the demo, the key fields are:

    • Cuisine → a single-select or multi-select field

    • Price → a text field

    • Kid friendly → a yes/no field

  • For Cuisine, define the available options, such as:

    • American

    • Mexican

    • Italian

  • Choose single-select if each place should have only one cuisine.

  • Choose multi-select if a place can belong to multiple categories.

  • You can add Photo or Image fields here as well to use later in the point cards.

  • These fields become the basis for filtering, marker icons, and point card content.

4. Fill in the data for each place 8:24

generated-image-at-00:08:24

  • After creating fields, assign values to each restaurant.

  • You can do this in two ways:

    • Edit each place individually

    • Use bulk edit to update many places at once

  • Example values from the demo:

    • Cuisine: Mexican

    • Price: $20

    • Kid friendly: Yes

  • Bulk editing is useful when you want to quickly populate repeated information across many places.

  • Once the fields are filled in, the map can use them for markers and filters.

5. Style the map header, layout, and marker icons 4:03

generated-image-at-00:04:03

  • In the map styling area, you can control the overall look of the map.

  • Options include:

    • Map title and subtitle

    • Header size

    • Text color

    • Feature color

    • Logo or cover image

    • Custom font

  • You can also hide the list if you want a cleaner map view.

  • For markers, you can choose:

    • One consistent icon/color for all points

    • Different icons based on a field like Cuisine

    • A custom uploaded image

  • Marker size and clustering are also configurable.

    • Clustering matters most when you have a large number of points.

6. Drive markers and filters from your custom fields 9:10

generated-image-at-00:09:10

  • Once the Cuisine field exists, you can use it to drive marker icons.

  • Select Cuisine in the marker settings to show different icons by cuisine type.

  • In Filter Fields, add fields users should be able to filter by.

    • Cuisine can appear as a dropdown or expanded filter.

    • Kid friendly can appear as a yes/no filter.

  • You can also add:

    • An advanced filter button that opens a popup

    • A search bar

    • Optional instructions for users

  • This is the core setup for making the map interactive and easy to browse.

7. Adjust the map’s visual style and default view 10:36

generated-image-at-00:10:36

  • Use the Displays section to change the overall visual style of the map.

  • Try different map themes to match the vibe of your project.

  • Set the default view area so the map opens to the right location and zoom level.

  • You can also adjust:

    • Rotation

    • Tilt

  • This is especially useful for non-standard maps like campus maps, where north-up orientation may not be ideal.

8. Configure point list behavior and shapes 12:00

generated-image-at-00:12:00

  • Decide how the point list behaves when someone clicks a point.

  • Options include:

    • Showing the list automatically on load

    • Keeping it collapsed until clicked

  • You can also add and style shapes on the map.

    • Example: draw a polygon around a neighborhood or event area.

  • Shapes can be customized with:

    • Color

    • Name

    • Duplicate/share options

  • You can set a default style so new shapes match your preferred look.

9. Add image overlays and other map decorations 13:22

generated-image-at-00:13:22

  • Use image overlays to place graphics on top of the map.

  • Common use cases include:

    • Sponsor logos

    • Artistic renderings of an area

    • Themed map graphics

  • You can position and resize overlays so they stay fixed on the map.

  • This is useful for branded or highly visual map experiences.

10. Set map actions and public interaction options 14:30

generated-image-at-00:14:30

  • Decide what actions users can take on the map.

  • Options include:

    • Showing map stats like view counts

    • Allowing users to add places

    • Allowing sharing

    • Allowing directions

    • Allowing users to send the map to their phone

  • The Add a place form is especially useful for crowdsourcing.

    • Users can submit places.

    • You can review and approve them before they appear publicly.

11. Customize the point card design and content 15:27

generated-image-at-00:15:27

  • The point card is what appears when someone clicks a place on the map.

  • First, style the card:

    • Rounded vs. sharp corners

    • Padding

    • Image height

    • Heading size

  • Keep image sizes reasonable so the card works well on smaller screens.

  • Then choose what content appears on the card:

    • Photo

    • Name

    • Address

    • Description

    • Custom fields

    • Buttons

  • You can hide any element you don’t want to show.

12. Use listing data and buttons inside the point card 17:14

generated-image-at-00:17:14

  • Point cards can pull in data from listings, which are reusable business records in your workspace.

  • Photos may come from:

    • Custom photo fields

    • Auto-collected online photos

  • You can control how photos display:

    • Fit

    • Cover

  • Custom fields like Cuisine, Price, and Kid friendly can be shown as text, pills, or highlighted values.

  • You can also add buttons for actions like:

    • Phone calls

    • Website links

    • Other URLs

  • Additional action settings let you control things like directions, saving places, visited status, and sharing.

13. Configure SEO, mobile behavior, and sharing 22:09

generated-image-at-00:22:09

  • Set how the map appears when shared publicly.

  • Customize:

    • SEO title and description

    • Preview image

    • App icon / home screen icon for mobile

  • Decide whether the map gets its own public SEO page.

  • Use the preview tools to check how the map looks on:

    • Desktop

    • Mobile

    • Embedded on a website

  • Share the map by:

    • Copying a link

    • Using a QR code

    • Embedding it on a website

Tip: If you need to "drag" a point or move it from the original place you put it down:

  • Click on the point, click edit

  • In the address area, click the edit or pencil icon

  • Click "move on map"

  • The point on the map will now be a blue circle, you can drag it to where you want it

  • When you are done, click "done" and then save the point changes

  • If you want to keep the "data" for the place (like the auto-collected photos or the original address) tied to the point (this is common if you are just dragging the point to show, perhaps, the entrance to the location. Keep the checkbox for "keep place data" on.

14. Reuse map data by promoting places to listings 24:19

generated-image-at-00:24:19

  • After building the map, you can reuse the same places in other experiences.

  • The map’s places live in a collection, and you can promote useful data to the listing level.

  • This avoids rebuilding the same restaurant records for every map.

  • Promote fields that should be reusable across maps, such as:

    • Cuisine

    • Kid friendly

  • Keep map-specific fields at the map level, such as:

    • Restaurant Week price

    • Special offers for that event only

  • Proxi can also auto-fill business data like hours and phone numbers at the listing level.

15. Add or move points directly on the map 29:16

  • You can double-click on the map to add a new point at that exact location.

  • This is useful for:

    • Parks

    • Meet-up spots

    • Street festivals

    • Temporary event locations

  • If a location changes, edit the place and use Move on map to reposition it.

  • This lets you fine-tune point placement without re-entering the whole record.

Did this answer your question?