Animate Canvas import into WordPress

[CBecker]

I have seen a few articles in the forum about adding a canvas into WordPress but they are older than a year ago and they don't solve the problem.

Has anyone successfully put an Adobe Animate canvas / animation into a WordPress page or post?

[CBecker · Accepted solution]

After trying many things I ultimately used an iframe successfully. Has anyone else found a better way? If not, I'll add a how-to so anyone else trying to accomplish this will be able to.

I really don't understand why Adobe hasn't made it simpler to incorporate an animate file (even the old SWF files from many years ago) into a WordPress page or post (WordPress being the most popular CMS out there).

[thomasb74905373]

Hi,

I have the same questions and wonder why we seem to be alone with that. Do you habe any solution now?

Animate projects with html, js, sounds, etc. really should be easily placed into WP Websites....

[CBecker]

Hi Thomas,

I still haven't heard of a better way of doing this. So here are some instructions on how to incorporate an HTML5 animation in WordPress. You will need to have admin access to your WP dashboard because you will be adding some code to the functions.php file.

Create your HTML5 animation as you would normally in Animate. Then collect your HTML5 animation files (HTML, JS and JPG) and upload them into a directory inside wp-content (html5 in my example).

Code to add in your functions.php file:

//[html5_function_call_01]

function function_name_01( $atts ){

return "<div class='html5-anim'><iframe src='http://www.domain.com/wp-content/html5/html5_animation_01.html' frameborder='0' scrolling='no' ></iframe></div>";

}

add_shortcode( 'html5_function_call_01', 'function_name_01' );

Code to add on your page:

<p style="text-align: center;">[html5_function_call_01]</p>

Notice I numbered my shortcode and function names. This is because I decided to put several animations on a single page (http://www.beckerstudio.com/services/​

I hope this helps.

[thomasb74905373]

THANK YOU!

[mercurman]

Hi, thank's for all your informations and code.… it's ok, but the animation is small, about 266x150 px and I cannot resize it in DIVI…