This page uses javascript to help render elements, if you have problems please enable javascript.
 
You are now inside the main content area
 
 
 
left col

iFrames

Embedded video is a major use of iframes on your pages, but there's a lot of other uses.  Sharing content from one website to another is made possible by using iframe elements.  Remember that when you are using an iFrame:

  • It is another website and not subject to the same navigation 
  • Content still needs to be accessible, video is required to have captions, and mute on autoplay
  • Responsive design is a must as your page may be loading on desktop, laptop, or mobile device
right col
 
left col

iFrames in Omni CMS

When using an iFrame you must have a TITLE attribute and content within the tags.  For example, your iFrame code is required to have <iframe title="my iframe title">SOME CONTENT HERE</iframe>.  When publishing the XSL will transform empty tags to self closing and break your pages.  

If you are getting content from YouTube or some other source, check to make sure that your inner content and title attribute are there, if not add them when you setup your page properties.

Video Format

Video has a unqiue ratio that is best maintained when in different sizes.  Using something like a 100% height doesn't make for a great viewing experience.  We have a specific format for videos which will automatically resize based on the display.

If you're using iframes in info blocks this will automatically be add to your content.

right col
 
 
left col

iframe-video

The video has been uploaded from YouTube and comes with a standard size.  

When you add this class you do not need to remove those attributes it will automatically resize the video.

ajax space
right col
 
left col

iFrame Content

We have styles that match our standard heights with iframe content that is not specifically video.  Remember that the device where your content is being served could be anything from a desktop to mobile, so you want to make sure your iframe content will also respond to the user's device.

right col
 
 
left col
ajax space
ajax space
right col
 
left col
right col
 
 
left col
right col