How do I embed a DOmedia map on my website?
To begin the process of embedding a DOmedia map on your website, you, as the media buyer or seller, should follow the steps shown below. Note: Any changes made to this map will automatically be reflected on your website.
To navigate to the map that you would like to embed on your website, start by clicking on 'Map Management' on the drop-down tab under 'Mapping'.
Once you find the map you wish to embed, click 'Map' located on the right-hand side of the table.
The map will open in a new tab. Adjust the map, if needed, by selecting or deselecting options under the panel in the upper right-hand corner of the map and the Locations panel at the bottom of the map.
When you have the map set the way you would like for it to be displayed on the external website, click 'Share Map' from the panel in the upper right-hand corner of the map to obtain the needed link. For example: https://www.domedia.com/d/public/map/shared/UniqueCode
Send the entire URL to your website developer, and have them follow the developer instructions below.
To finish embedding a DOmedia map on your website, your website developer will need to follow the steps shown below: 1. Obtain the URL for the shared map from the media buyer or seller. For example: https://www.domedia.com/d/public/map/shared/UniqueCode
2. After the '/shared/' portion of the URL and before the unique code, insert 'iframe/' into the URL. This will enable the content to be an embeddable iframe, which will fit better when embedded on the website. For example: https://www.domedia.com/d/public/map/shared/iframe/UniqueCode
3. In the area of the website where you would like to place the embedded map, simply paste in the following line of code with the correct URL (update UniqueCode) from the shared map:
<iframe width="600" height="450" frameborder="0" style="border:0" src="https://www.domedia.com/d/public/map/shared/iframe/UniqueCode" allowfullscreen></iframe>
4. Set the width and height accordingly to fit the design of your website. 5. At this point, the map should work on your website.
For additional information or troubleshooting help, please review the information below: If your website is not secured with a SSL certificate (website beginning in https://), you may have issues loading 'mixed content', resulting in the request being blocked. You can determine if this is the cause of your issues by accessing your browser's Developer Tools and reviewing 'Console'. To fix this issue, replace the 'https://'; at the beginning of the URL with '//' to allow the website to embed from the HTTP protocol of its origin.
If you have a responsive designed website, and would like the map to respond based on changes from its containing element (e.g. div, section, span, etc.), you can make the embedded map responsive by doing the following: Create the following CSS classes in your stylesheet, and wrap the iframe in a div with the class of 'google-maps'.