Adding a trail map to your own travel blog or mountain bike club website is a snap with Singletracks trail map widgets. Choose from area maps, individual trail maps, and custom trail lists to give your site visitors the info they need.
Area maps
The easiest way to get started is to find a map on Singletracks using the search box at the top of the page, or by drilling down to a country or state from this page. Find the link that says ‘Share this map on your website’ just below the map, as indicated by the arrow in the example above.
From here, you can grab the HTML embed code as is, or adjust the height to fit your site. The map is responsive so the width will adjust depending on whether your viewers are on desktop or mobile devices.
The ‘Area’ field adjusts the location of the map, as shown above. Alternatively, the widget form is accessible here and in the site footer. Singletracks also offers an API for developers and more advanced coders who want additional control over how trail data is used and presented.
Individual trail map
To get a map of a single trail, navigate to the trail page on Singletracks using the site search, or again by drilling down. Look for the link below the map that says, ‘Share this map on your website’ as indicated by the arrow above.
The widget form is basically the same as in the first example. Note that the ‘Trail’ field can be used to select a different trail, which is helpful if you need to generate embed codes for multiple trails. Just start typing the name of the trail, and select it from the list of suggestions that appears.
Custom trail lists
Singletracks gives members the ability to create custom trail lists, and if you’re not familiar with this feature you can learn more here. Once you’ve created a list, you can share it just like the area and individual trail maps above.
Navigate to your profile page (Account -> View Profile at the top right) and choose the list you’d like to share from the gray box on the right as shown in the screenshot above. If you’re on a phone or other small device, the gray box will be located near the bottom of the page. Once again, look for the link below the map that says ‘Share this map on your website.’
I created my own custom list of Georgia State Parks, and from the form shown above I can grab the map code to share it on another webiste.
Maps are a great addition to any website to help viewers better visualize trail locations and configurations. Are you using Singletracks trail maps on your website? Drop a link to your site in the comments!
