All Collections
Publishing Videos
Spotlightr on Instapage
Spotlightr on Instapage

How to add Spotlightr videos to your Instapage pages

Updated over a week ago

Instapage does have a video element/widget but does not yet include Spotlightr in that integration. That's not a problem because you can use their HTML widget to add our videos to their pages.

Now, for some reason Instapage makes the HTML element align right by default. We've contacted them about this but haven't had much luck getting them to recognize this issue.

If you add our default embed code and align the widget in the center of the page in their page builder it would look like this:

Yet when you check the page it will look like this:

If you add "text-align:left;" to the div style it will work. We aren't sure why it doesn't center automatically. Nor do we understand why adding "text-align:center;" won't work. It must be aligned left to actually be centered.

Once you add that it will be centered:

So if your embed code looks like this:

<div style="position:relative; width:1px; min-width:100%;padding-bottom:56.25%;"><iframe allow="autoplay" class="spotlightr" allowtransparency="true" style="width:1px; min-width:100%; height: 100%; position:absolute" allowfullscreen="true" src="https://spotlightrteam.cdn.spotlightr.com/watch/MTE5NzkwMg==?fallback=true" frameborder="0" scrolling="no" name="videoPlayerframe"> </iframe></div>

Change it to this:

<div style="position:relative; width:1px; min-width:100%;padding-bottom:56.25%; text-align:left;"><iframe allow="autoplay" class="spotlightr" allowtransparency="true" style="width:1px; min-width:100%; height: 100%; position:absolute" allowfullscreen="true" src="https://spotlightrteam.cdn.spotlightr.com/watch/MTE5NzkwMg==?fallback=true" frameborder="0" scrolling="no" name="videoPlayerframe"> </iframe></div>

Keep in mind a couple of things about Instapage:

  • As per their support, HTML elements shouldn't be tested in "Preview" mode and need to be seen on a live page for you to know what is really happening with the element and how it will look on the page.

  • Once you update the page, we've noticed that sometimes it takes up to 30 seconds or more for the live page to actually update.

Did this answer your question?