Tumult Hype Animations Wordpress Plugin



12 posts were split to a new topic: Wordpress Plugin Embed: Troubleshooting Responsive Document


Here’s one example of a Hype document scaling based on its width. By adjusting the group bounds, and setting scaling & flexible properties on the group, it will expand based on the available width of the Hype document:

scaling-width-shrink-fit.hype 3.zip (953.2 KB)

You can achieve different results if you change the boundary of the group so that it only encloses the actual content you want to never be cut off on the top or bottom, instead of the entirety of the scene. For example, try adjusting the group bounds to just fit the two squares – it will ensure they always fit the available space and are never cut off, but you can get the background image to stretch outside of the boundaries of the document.

(Alex) #65

Hello @Daniel,

The project works well with Firefox, Chrome, and other browser. but I found there a error with IE:

Anyway to resolve it?




What version of IE?

(Alex) #67

ie8, ie11, ie12

And I have not test with ie 9 and 10.

(Jonathan Deutsch) #68

I’m not able to reproduce the issue on IE8 or IE11… does this happen at a specific time or on load? Any chance you could provide a translation for the error as well?

Did you make any modifications to the document or do an Advanced Export?

Are you using a specific VM? (If it is from MS, let us know).

(Alex) #69

Hello @jonathan

please check my site at https://www.lovcour.com

you will find it happens on load.

our server is on VM, with HHVM+Nginx+Redis cache

Frankly, I am not sure where the errors from.


(Jonathan Deutsch) #70

How did you export the site? I’m guessing you might have used Advanced Export and the Support Internet Explorer 6-9 box is unchecked?

This is a bug, but the workaround is to check that box (especially because you do seem to want to support IE 8-9 at least!)


3 posts were split to a new topic: Large OAM fails uploading via Hype Animations Wordpress Plugin


I am getting warnings after latest update when uploading and replacing Hype OAM through plugin and the embeds don’t load the Hype script files as they don’t find them.

**Warning** : rename(XXX/wp-content/uploads/hypeanimations/tmp/Assets/information_box_max_2.hyperesources,XXX/wp-content/uploads/hypeanimations/tmp/Assets/index.hyperesources): No such file or directory in **XXX/wp-content/plugins/tumult-hype-animations/includes/adminpanel.php** on line **184**

Update: This seams to be an issue with " " (whitespaces) in the OAM file name!


Pull requests welcome! A warning should be sent when this is attempted…

(Alex) #74

Thanks, I think I did not check the I.E. compatibility:slight_smile:

(Quint Rahaman) #75

I am using the hypeanimations shortcode on a couple of my WordPress pages. At what point in the WordPress action hook sequence does the Hype js file load?

I ask because I would like to load a specific js file, via the wp_enqueue_scripts action hook, BEFORE my Hype js file loads.



The Hype JavaScript will be loaded just as if you had the embedded JS on the page. The page is rendered by the server for each request (or during any caching). So if you had a wp_enqueue_scripts function setup, this would likely place the JS code within the head. So just placing it there should do the trick.

If you’re doing anything that depends on a Hype file being loaded, then you should be waiting for the HypeDocumentLoad event. You could wrap any ‘run this after Hype has loaded’ functions in something like this:


  function documentHasloaded(hypeDocument, element, event) {
    // Do something here...

  if("HYPE_eventListeners" in window === false) {
    window.HYPE_eventListeners = Array();
  window.HYPE_eventListeners.push({"type":"HypeDocumentLoad", "callback":documentHasloaded});


(Quint Rahaman) #77

Thanks for the quick and comprehensive response, Daniel. “Likely” is correct, that is, if one does not change the default.

(David) #78

I have uncheck “Protect from External Styles” (https://blog.tumult.com/2018/01/19/easy-embedding-html5-animations-in-wordpress-with-the-official-hype-animations-plugin/), but I do not see the font used by the Wordpress template… if instead I try to use a custom CSS font from hype (version 3.6.7), uploading the widget OAM, I do not see the font… I see a Times font (safari on Macintosh MBP). Is there a custom font bug with the OAM widget? Wordpress v. 4.9.6, plugin Wordpress v. 1.7.2. Thanks.


This should work as expected if you select the ‘iframe’ embed method. When embedding using the <div> method, the head of your Tumult Hype document is not included. The iframe method includes the CSS reference to the webfont in the head of your document.

Here’s another way – not really recommended: Copy the Webfont CSS into the inner HTML of a rectangle. Since you can have Style tags anywhere in Html, this allows you to load a webfoot without using the <head>...</head> area.

Alternatively, you could add the code representing your font to your Wordpress theme.

(David) #80

Thanks Daniel,
I had to put a class (min-width: 100%) to see it correctly. The font is now correctly view, keeping the responsive layout. Thank you very much! :slight_smile: