Wordpress Plugin - <div> setting not working, <iframe> works

I’m using the new plugin for wordpress and I’d like to be able to embed the animation in a div as opposed to the iframe. However, after I upload the .OAM then I select div from the dropdown on the widget page, the animation fails to load.

It loads when I select the iframe option, although the iframe is setting the canvas to the mobile layout.

In the console I get the error message:
mywebsite.com/test-animation/calendar.hyperesources/HYPE-596.thin.min.js

Assuming its a pathing issue.

Thanks

Can you share the page where it’s not working? ( I was for a second hoping you had the mywebsite.com domain. Major props).

Does your Hype document have anything in the <head> that it depends on to run? The DIV option strips all this out and reduces the embed to just a single JS embed which in turn loads all the other JS (including the HYPE-596 file you shared above).

The div option might also might cause issues with responsive layouts, so if you have ‘height’ checked in the responsive layout options, uncheck that.

Thanks Daniel, we were able to resolve the issue by adding the code into the WP text editor.

<div id="calendar_hype_container" style="margin:auto;position:relative;width:480px;height:300px;overflow:hidden;">
  <script type="text/javascript" charset="utf-8" src="https://www.mywebsite.com/wp-content/uploads/2018/10/calendar_hype_generated_script-1.js"></script>
</div>

haha, sorry about the mywebsite, just didn’t want to make it public.

1 Like