Skip to content
Show physical locations on a map
JavaScript CSS
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Type Name Latest commit message Commit time
Failed to load latest commit information.

Gatsby Theme Location Mapper

[Demo] (

This is a location mapper Gatsby theme intended to display different locations, and information about the locations on a map.

Primary use case: Store Locator - displaying locations on the map with hours, website, and phone number.

Necessary Frontmatter

name: new york
lat: 40.712
lng: -74.006
hours: 9AM-5PM
days: M-F
address: 262 Canal St, New York, NY 10013
description: Our flagship location, located on SoHo.

Theme Install

  1. Add the package
npm install --save gatsby-theme-location-mapper
  1. Add "gatsby-theme-location-mapper" to your site's gatsby-config.js
  module.exports = {
    plugins: [
        resolve: "gatsby-theme-location-mapper"
  1. Restart your development server
gatsby develop
  1. Visit http://localhost:8000/locations/all

Demo Site & Theme Setup

# clone the demo
git clone
# move into directory
cd gatsby-theme-location-mapper
# install dependencies
#start the demo site
yarn workspace site develop

The demo will now start at http://localhost:8000

Create a new markdown file in site/locations , add necessary frontmatter, and save, then restart your server and view localhost:8000/locations/all to view your location!

You can’t perform that action at this time.