Adding Engage Content to Another Site Using iFrames

Clients have two options when using iFrames to add content to their site: embedding an active Engage page or embedding a specific engagement.  To get started select “Portable Pages” from the “Sites” navigation item and click on the <iframe> tab on the left of the page.

iframe

On the iFrame page of the Engage admin you’ll find a quick tool that allows you to select a published page or active engagement and see example iFrame code.

iframe

Once ready, add the generated code to the source editor of your website to have Engage elements appear.

At the bottom of the screen, you’ll notice additional <iframe> only CSS. This styling will only be added to pages where the URL starts with iframed.cqrcengage.com.

iframe

Examples of clients using iFrame CSS to match embedded elements to their main site styles:

Important things to remember:

  • Twitter engagements will not work in iframes.
  • Any engage page can be made iframe friendly by adding the subdomain “iframed” to the URL examples http://iframed.cqrcengage.com/jobs3/.
  • Click here for more information on iFrames.

This is the basic iframe code we recommend starting with:

<iframe src=”URL HERE” frameborder=”0″ scrolling=”auto” marginheight=”0″ marginwidth=”0″ height=”1200″ width=”100%” ></iframe>

Other code options

  • frameborder=””  – this value will be an pixel value ex: 5
  • marginwidth=”” – this value will be an pixel value ex: 5
  • marginheight=”” – this value will be an pixel value ex: 5
  • scrolling=””

Author: Engage Team

Share This Post On