Each Pixel Union Shopify theme comes with an eye-catching Map section. Connect with Google Maps to display location, hours, and more.
Add Map to the home page
Go to your theme in the Online Store > Customize > Sections > Add section > Map > Add
Include optional heading
Add a Heading, then add text content (e.g. Hours & Location).
Adjust display settings
Here you can adjust Text alignment, as well as Desktop and Mobile layout settings to get the display of your Map section's text information just right.
Add the address for your location
The Map address will be the point Google uses to drop its pin.
Connect with Google Maps
To pull a map into your homepage, you'll need to generate Google maps API key and paste it into the Google Maps API key field.
Customize the Map colors
You can also customize the display colors of the map using the Map foreground color and Map background color pickers.
These do not control particular components of the map (streets, water, etc.) but rather the swatches are linked to the overall color scheme of the map.
Next, you can upload the Image that will be used in the event that the map can not be loaded. This can be a screenshot of a map, or anything else you want to display in the event the customer's browser does not successfully load the map.
Control the focal point for the map
Use the Image position settings to adjust the focal point for the image.