How do I embed or insert a map (or other dynamic content) in to my page?

How do I embed or insert a map (or other dynamic content) in to my page?
 
Rather than using static photo's or graphics, it is possible to insert dynamic maps (or other content) that can interact with your user (zooming in and out and more). - Maps, weather widgets, 3rd-party searches, news tickers etc
 
While embeded objects typically have a degree of associated branding, the plus of extra function and reduction in your bandwidth usage is the tradeoff
 
The key to embedding is find the appropriate HTML code to insert in the HTML design view of your page.  Many online services now provide options for generating the code for you to do this, but for the purpose of explanation we will show you here how to insert a Google Map in to a single plain page.

How to embed content e.g a Google Map in to a single plain page. 

  • On the site you want to insert from http://maps.google.com/ position the map to the view you want to insert
  • Click "Link" just above the map
  • Highlight and copy all of the code in the "Paste HTML to embed in website" field
  • Return to your website editor in our CMS, go to the editor of the page where you want to insert the map
  • Position the cursor and type some unique text in the spot where you want your map to appear (for example "replace this text") you can position this text using a table or just keep it at the top left of the page.
  • Click on the [HTML] button in the toolbar
  • Find the unique text you typed earlier - it will be there amongst the code.
  • Paste the code you copied earlier from the external site in the place of your unique text i.e. remove "replace this text" and put the code you copied earlier in it's place. 
  • Click on the Apply/Save changes button and hey presto, view your map.
  • Save then publish

Note, because the above references an external site, these instructions can only be a general indication.  Help files from the external site in question should explain any changes or details, such as changing the size of the embedded object etc.

Alternative approach - use Smart Blocks to manage the content and embed the content using a [TAG].

You can add your embed code to a Smart Block and paste the code into the block in HTML mode.

For info on Smart Blocks - see this help file.

You can then paste the tag that is based on your title e.g. [EMBEDCODE] into the content editor of your choice where it will be replaced by the content.

Index Previous Next