Copy link to clipboard
Copied
Is there any tutorial for adding an HTML5 Canvas from Adobe Animate to WordPress WITHOUT using an iFrame? I have added animations successfully using an iFrame in the past.
But this time I am trying to get the animation as part of the actual code in WordPress via a shortcode so that a lightbox plugin links work and I might possibly be able to hack the code to get the images in it places dynamically using Advanced Custom Fields. But have failed miserably.
There should be a way, the output of Animate is just code talking to code, but I can't seem to get it working.
Copy link to clipboard
Copied
Hello
Currently ask myself the self question.
Hint: the output as canvas is basically a bunch of html, loading the .js file and applying it to a div with an ID.
> enqueue_script (WP function)
then add a php function to return the div, fires the init() of the .js function with the correct ID with a shortcode... which I can only imagine, not realize.
Copy link to clipboard
Copied
I have solved this problem.
this issues is caused by the animation JS file where image's manifest with a wrong path.
If you paste the animation js and image file into the wordpress theme folder.
You should do it as below step.
For example.
open the animation JS. and then search and replace 'src:images' to 'src:wp-content/themes/Your_theme_name/images'
Original path (Wrong path):
manifest: [
{src:"images/image_name.png", id:"ABC"}
],
rewrite it to a Right path:
manifest: [
{src:"wp-content/themes/Your_theme_name/images/image_name.png", id:"ABC"}
],