Instructions for Using the Location Map Widget

 

Instruction

This widget displays a responsive Google Map iframe inside a card. Follow the steps below to customize and use it:

---

Step 1: Customize the Data Structure

• Locate the following fields in the widget's data structure:
  • Header Title: Change the text inside the <h5> tag in the card-header to update the title (e.g., "Location").
  • Google Map Iframe URL: Replace the src URL of the <iframe> tag with your own location's iframe link from Google Maps.

---

Step 2: Get an Iframe from Google Maps

1. Search for the Location:
   • Open Google Maps and search for your desired location.
2. Get the Embed Link:
   • Click the "Share" button.
   • Navigate to the "Embed a Map" tab.
   • Copy the iframe HTML from the provided link.
3. Replace the Iframe URL:
   • Paste the copied src URL into the iframe tag in the widget.

---

Step 3: Save and Test

• After making the changes, save the widget's code and refresh your webpage to see the updated map.

---