Marketing Tip #009 – Use Google Maps to embed your location on your website

CrossFit Website Design & Marketing Tips

Go to Google Maps, and enter your address in the search bar.

Screenshot 2015-02-02 14.35.29

You’ll be taken to your location in Google maps.  You may want to zoom out (using the controls in the bottom-right corner) so that more familiar roads/intersections are visible in the window.  Then click on the cog icon in the bottom right to open a menu.  Click on the “Share or embed map” item.

Screenshot 2015-02-02 14.47.10

This will popup another dialog box with 2 tabs “Share link” and “Embed map”.  Make sure “Embed Map” is selected, and it will give you the <iframe> code you’ll need to embed on your website.  Copy this code.

Screenshot 2015-02-02 14.47.41

When you go to paste the code into your website, make sure you change the [width=”600″] to [width=”100%”], as this will allow the map to expand/contract to the exact width of the page it’s being embedded on.

Powered by Awesome clients:

We use a special plugin that will help make sure you don’t accidentally delete the map when you’re editing the page (sometimes html code can get stripped out by website editors).  You will need to replace the “<iframe” with “ ” at the end of the code.

Example code from Google:

Example code after being modified: