Video embed HTML not rendering on my timeline
-
Hello, I’m having trouble with embedding videos from Wistia on to my timeline. Previously, this was working properly.
Wistia gives two embed code options for embedding videos. When I try using the “responsive standard” option, I add the following HTML to my timeline story:<script src="https://fast.wistia.com/embed/medias/g42fpb7l6r.jsonp" async></script>
<script src="https://fast.wistia.com/assets/external/E-v1.js" async></script>
<div class="wistia_responsive_padding" style="padding:56.25% 0 0 0;position:relative;">
<div class="wistia_responsive_wrapper" style="height:100%;left:0;position:absolute;top:0;width:100%;">
<div class="wistia_embed wistia_async_g42fpb7l6r seo=true videoFoam=true" style="height:100%;position:relative;width:100%">
<div class="wistia_swatch" style="height:100%;left:0;opacity:0;overflow:hidden;position:absolute;top:0;transition:opacity 200ms;width:100%;">
<img src="https://fast.wistia.com/embed/medias/g42fpb7l6r/swatch" style="filter:blur(5px);height:100%;object-fit:contain;width:100%;" alt="" aria-hidden="true" onload="this.parentNode.style.opacity=1;" />
</div>
</div>
</div>
</div>After publishing the page, the video embed does not display. The following appears in the page’s HTML source:
<p><br />
</p>
<div class="wistia_responsive_padding" style="padding:56.25% 0 0 0;position:relative">
<div class="wistia_responsive_wrapper" style="height:100%;left:0;position:absolute;top:0;width:100%">
<div class="wistia_embed wistia_async_g42fpb7l6r seo=true videoFoam=true" style="height:100%;position:relative;width:100%">
<div class="wistia_swatch" style="height:100%;left:0;opacity:0;overflow:hidden;position:absolute;top:0;width:100%">
<img src="https://fast.wistia.com/embed/medias/g42fpb7l6r/swatch" style="height:100%;object-fit:contain;width:100%" alt="" aria-hidden="true" />
</div>
</div>
</div>
</div>There’s also a “responsive fallback” option. I also tried that option, which uses this HTML:
<div class="wistia_responsive_padding" style="padding:56.25% 0 0 0;position:relative;">
<div class="wistia_responsive_wrapper" style="height:100%;left:0;position:absolute;top:0;width:100%;">
<iframe src="https://fast.wistia.net/embed/iframe/g42fpb7l6r?seo=true&videoFoam=true" title="The Khoury College Oath for Computing Professionals Video" allow="autoplay; fullscreen" allowtransparency="true" frameborder="0" scrolling="no" class="wistia_embed" name="wistia_embed" msallowfullscreen width="100%" height="100%"></iframe>
</div>
</div>After publishing the page, the video does embed does not display. This appears in the page’s HTML source:
<div class="wistia_responsive_padding" style="padding:56.25% 0 0 0;position:relative">
<div class="wistia_responsive_wrapper" style="height:100%;left:0;position:absolute;top:0;width:100%">
</div>
</div>Is there a way to prevent the HTML I’m adding to the timeline story from getting altered when it’s displayed on the page.
The page I need help with: [log in to see the link]
- You must be logged in to reply to this topic.