The Turbo theme includes a Map page section which is a great way to give your site a more local feel and helps build confidence in your brand as it makes it easy for your customers to find where you are located. The Map section is also helpful if you have a physical location as well, or just want to show what city you’re located in.
Thanks to the integration with Google Maps, customers can get directions to the location if you have a brick-and-mortar shop or office. If you’re online-only, the Map can still be a nice way to showcase your general location. Instead of using a specific street address, using a city name can be a great way to show your local pride and reinforce your credibility as a merchant.
The Map section also includes an optional integration with the Google Maps API. In order to make use of the Google Maps API, you will need to register for an API Key.
Follow Shopify's instructions on registering for a Google Maps API Key which can be found here. If you do not wish to register for an API key, the original map setting with the iframe will work as default.
Add this section to the
The section settings determine the look and layout of this section.
Upload an Image to display in case the map is unable to load. Upload a Mobile image to have a separate image for mobile devices.
You can choose to enable Wide display so this section will spread out the full width of the screen.
Here's where you can type in the Address that you'd like to show up on your Map section. Make sure to enter your full address so Google Maps can find the exact location. Once entered, the map will appear:
With the Map height setting, you can determine the height for this section. You can choose for your map to be anywhere from 300px to 600px tall:
Map zoom Level
The Map zoom level setting will adjust how much your map is zoomed in by. Choose anywhere from 1x (max zoomed out) to 20x (max zoomed in):
Google Maps API key
The Map section includes an option to use a Google Maps API Key. In order to make use of the Google Maps API, you will need to register for an API Key.
When using the API Key, you then have the option to hide/show the pin with the Show pin setting.
Map color scheme
When using the API Key, you have the option to choose a Color scheme for the map.