Jump to content
Search Community

Greensock-material on a Wordpress-site

ijwebbdesign test
Moderator Tag

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts

Hi Greensock,

My question is how and where do I insert Greensock-material on a Wordpress-Page?

 

I have created a SVG-animation that works perfect and placed it in a html-file and now I want to transfer the animation-material to a Wordpress-page.  The animation use following scripts:

jquery-2.1.3.min.js 

TweenMax.min.js 

MorphSVGPlugin.min.js 

DrawSVGPlugin.min.js 

demo5.js (this is where I have placed the animation-code)

 

CSS-material

demo5.css

jquery-ui.css

 

Where in Wordpress do I put all this files?

 

Best regards

Ingemar Jönsson

Sweden 

Link to comment
Share on other sites

It probably depends on how you want to you use GSAP animations. Are they going to be integrated into a theme or are you just trying to get an animation to run inside a blog post?

 

I'm not a wordpress guy, so I won't have any expert advice for you, but this thread covers a bunch of options: 

 

 

If none of that makes sense you may want to just create your animation on CodePen and use their embed feature:

 

https://blog.codepen.io/documentation/features/embedded-pens/

  • Like 3
Link to comment
Share on other sites

Hi Carl,

 

For now my Purpose is to let the animation run in a blog post. But maybe in the future I want to integrate GSAP in a theme, because I like the animation-platform and there is a lots of potential to create great stuff with GSAP.

 

Have a nice day  

  • Like 1
Link to comment
Share on other sites

  • 2 weeks later...

Hi again,

 

I still have some questions about where and how to place Greensock-material on a Wordpress-site.

 

Backgroundinformation:

My svg-animation use one js-file called "animation.js" and one css-file called "animation.css". I use the SVG-support-plugin in Wordpress so I can store svg-images in my media library and style svg-elements using css.

 

The svg-image for the animation is embedded on a Wordpress-page (not in a blog post) and I use the "style-svg"-class in SVG-support-plugin so the svg-image will be rendered as an inline svg, rather than an IMG-tag.

 

The "animation.js"-file consists of tweenMaxLite, Morph SVG-plugin, Draw SVG-plugin and some specific code for the animation.

 

My questions are:

1) Where in Wordpress do I place the "animation.js" and "animation.css" files?

 

2) Do I have to write some extra code on the Wordpress-page where the svg-image/animation is placed?

 

3) Since Wordpress use and automatically loads jQuery. Do I still need to add some jQuery-script so Greensock will work properly?

 

Ingemar Jönsson

Sweden

 

 

 

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...