Tag Archives: embed

Adding HTML code to pages

Advanced features, , , , , , , , ,

Adding HTML coding into the CMS can be done and is one of the positive features that provide us a lot of flexibility within the system.

This functionality is of interest mainly to our users who have basic HTML programming notions.

Although you might find these can also come in handy for you one day, even if you have never delt with code.

Anyway, here are some of our HTML code templates:

 

Where to add the code?

HTML coding can be added into any text container within our site.

All you have to do is:

  1. Open a text container. Yeah, just any normal text container (it will work anywhere, on the float, on the main column, anywhere)
  2. When you are at the edit text box, click on the “source” button at the top, like in the image below:
    HTML Source

After you understand how to use this, you are ready to embed videos, flash or anything else HTML permits you to do.

For more complex code we recommend you use the special container. But that is only for the initiated, in other words, hot shot developers.

If you want to know more the special container, just contact us.

 

Iframes – Embed another website into your page

<iframe width=”100%” height=”350″ title=”title_you_want_to_give” type=”text/html” src=”http://source_file_URL“></iframe>

Change the blue part with the actual URL of the website that you want to embed. Also change the tag in the Title.

 

Add image to text containers and news / publication articles

Example:

<center><img alt=”Add caption here” src=”http://assets.panda.org/img/original/g8_graphic_e_4c_small.jpg“> <br />
<a href=”http://assets.panda.org/img/original/g8_graphic_e_4c_1.jpg“><em>Click to enlarge</em></a><em> (© WWF/Meike Naumann)</em></center>

 

YouTube video

Just copy the HTML embed code YouTube provides after you upload the video. Or, go to the video on youtube and choose the option “Share” (under the video). Then click on the “Embed” option and you will see a field with HTML code. Copy this code and embed it into the HTML part of your text container in the CMS.

Look/copy the code example below:

<iframe width=”560″ height=”315″ src=”//www.youtube.com/embed/-n5HeMXn-cs” frameborder=”0″ allowfullscreen></iframe>

Note:

  • Change the blue part with the ID of your video.
  • You can alter the width, height and other parameters above to adapt the video to the different containers in our CMS.
    – For the middle column (3col. template): width=”100%” height=”350″
    – For the right column (3 col. and float container): width=”100%” height=”200″