Warning: The IFRAME embed method is only recommended if the JS embed method does not display due to conflicts with your existing website JavaScript. The IFRAME embed method will not dynamically scale to your container element.
To embed a Woobox campaign within an external webpage, you’ll want to use the following basic IFRAME tag within the HTML for the site content, wherever you want the campaign to be placed:
<iframe src='https://woobox.com/xxxxxx'
frameborder='0'
height='750'
width='100%'
scrolling='no'>
</iframe>
You’ll just need to replace the following parts in the embed code (found under Embed on Website on the Overview page) with the relevant information and styling for your promotion/website.
- The first part of the IFRAME’s src (
https://woobox.com/xxxxxx) would be replaced with your campaign’s short URL (which you can find in the promotion’s dashboard). - You can also adjust the height and width of the IFRAME as needed for your specific campaign’s content, and the width can be whatever you’d like, as our apps are all mobile responsive!
- If you want the campaign to show as truly responsive, you will need to add the following to your page:
<meta name=”viewport” content=”width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no”>
- ALSO IMPORTANT: If you are embedding the campaign in an SSL/HTTPS secure webpage
You will want to make sure you’re using the https:// version of the promotion URL when you embed it, otherwise it may not show in some browsers, depending on the site where you’ve embedded it.