Adding Stylish Maps to Your Page Is an Interactive Experience

Adding-Stylish-Maps-to-your-Page-is-an-Interactive-Experience-2You can now place maps in your page designs using Page Builder Sandwich!

It’s a weird thing to be excited about maps. You grab the Google Map URL then embed it. Or maybe grab a map plugin online and put in a shortcode. Or maybe your other page builder already has one and you can add one any time you want. But the reason why we’re excited is that we have brought adding maps to a whole new level.

Here’s a preview:

The Old Boring Way of Adding A Map

Here’s how you add a map with your typical page builder:

  1. You drag a new map element,
  2. You enter the latitude and longitude in the fields,
  3. You enter in other values in the fields like map height, map width, tick the road style checkbox, etc,
  4. Hit preview and check what it looks like and decide that you need to change something to make it look cooler,
  5. Go back to the page builder and change the values, then repeat step 4 above.

The Page Builder Sandwich Way of Adding A Map

Maps in websites are interactive – you can pan around, zoom in and out the map. So we thought, why not remove all the guess work and just allow people to interact with the map directly while building your page?

Here’s how you add a map with Page Builder Sandwich:

  1. You add a map element,
  2. You type in the latitude and longitude or address where you want the map to center on,
  3. You move the map around and zoom in or out of it to get your desired look,
  4. Add some cool colors to your maps to fit your style,
  5. Hit save.

Our way is much more fun and intuitive. You essentially interact with the map the way you would with a normal Google Map.

Colored Maps or Style them with SnazzyMaps

An awesome feature we’ve placed in is the ability to tint and color your maps, and it’s super easy to do. (This is for the premium version only). If you want to colorize your map, just click on our color picker and choose a color, and your map would immediately change.

Here’s one that we’ve tinted pink:

Page Builder Sandwich also supports more elaborate color schemes via SnazzyMaps. They have a huge list of user-contributed color schemes, and they let you create your own if you want more control over the colors.

Just find the color scheme that you like, then grab the code and paste into Page Builder Sandwich. The color scheme will get applied to your map right away.

Here’s a cool color scheme called papuportal dark from SnazzyMaps:

Put Maps Wherever You Like

There are a lot more cool stuff that you can do with maps – like add them in full-width rows for a more dramatic effect. You can also add them inside a carousel if you like, or inside tabs (an upcoming feature).

If you don’t have Page Builder Sandwich yet, you can try out the premium version by clicking on the “Live Demo” link above.