Get your new map code #
First things first, let’s grab the most accurate map code from Google Maps:
- Open Google Maps in your web browser. You can just search for “maps” or go to maps.google.com.
- Once you’re there, search for the address you want to display on your map. In this case, we’re looking for Potentia, Lafayette, California.
- After the map loads, click on the “Share” button (it usually looks like an arrow pointing to the right or a three-dot menu).
- From the sharing options, select “Embed a map.”
- You’ll see a preview of the map and some HTML code. Click on “COPY HTML” to snag that code.
2. Head Back to Your Builder #
Now that you have the new map code, let’s go back to where your map lives in your builder:
- Navigate to your builder.
- Find the section where your map is embedded.
- Open the Code Editor for that map section.
3. Replace the Map Source #
This is where the magic happens! We’re going to update the source of your map:
- In the Code Editor, you’ll see a bunch of HTML. Look for the part that starts with
<iframe src="and ends with"></iframe>. - We only need to grab the source part, which is the URL within the
src=""attribute. It starts withhttps://and goes all the way to the end of the URL before the closing quotation mark. - Copy this URL from the HTML code you got from Google Maps.
- Now, in your builder’s Code Editor, delete the old source URL from the
src=""attribute. - Paste the new source URL you just copied from Google Maps into the
src=""attribute. It should look something like this:<iframe src="YOUR_NEW_Maps_URL_HERE"></iframe>.
4. Check and Publish! #
Almost there!
- After you’ve replaced the source, preview your map. You should now see it working perfectly!
- If everything looks good, go ahead and publish your changes.
And that’s it! Your map should now be accurately displayed for everyone to see.
A quick heads-up: While you’re in the builder, you might notice a disclaimer on the page. If you see it, please double-check with your team to make sure it’s removed. It’s always good to keep your pages looking clean and professional!