Adding GSAP club to Wordpress

[Tribius]

Hi!

 

I just bought GSAP Club for my business.  Most of our clients websites are wordpress based though we do host them on our server. Up to this point I've loaded the free versions of GSAP by using CDN but I've just discovered that's not an option for the club plugins.

 

I've created a child-theme and uploaded all of the minified .js files from the GSAP plugin bundle and tried to use:

<script src="my-url/js/splittext.min.js/"></script>

on my site. The animation is playing in the "builder view" of Elementor but when I go in to preview aka the actual site it's not. Am I going about this in the wrong way? Is there any other solution to getting the plugins up and running? 

 

Super eager to try out the Club plugins and really have to compliment you on your work here in the forums (ps. love your new branding)

 

// Jonas

[Cedec]

Hi Jonas,
 

Are you sure you are entering the correct url in scipts?
 

Currently, after entering the url  my-url/js/SplitText.min.js we get a 404 and not a JS file view.

I checked in your files that the correct file url is my-url/js/SplitText.min.js

 

I checked in your files that the correct file url is my-u/js/SplitText.min.js
 

Maybe changing the link in the script to: <script src="my-url/js/SplitText.min.js/"></script> will help you?

[Tribius]

Nope, still got the same issue. Like I said the linking works correctly in the builder but not in the preview. Thanks anyway!

[Rodrigo]

Hi @Tribius and welcome to the GSAP forums!

 

Thanks for being a business user and supporting GSAP! 💚

 

Be sure to enqueue your premium files correctly with GSAP core as a dependency and your custom JS file with the Core and plugins as dependencies as well:

< ? php
   // The proper way to enqueue GSAP script in WordPress

   // wp\_enqueue\_script( $handle, $src, $deps, $ver, $in\_footer );
   function theme\_gsap\_script(){
   // The core GSAP library
   wp\_enqueue\_script( 'gsap-js', 'https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.2/gsap.min.js', array(), false, true );
   // ScrollTrigger - with gsap.js passed as a dependency
   wp\_enqueue\_script( 'gsap-st', 'https://my-url.com/js/SplitText.min.js', array('gsap-js'), false, true );
   // Your animation code file - with gsap.js passed as a dependency
   wp\_enqueue\_script( 'gsap-js2', get\_template\_directory\_uri() . 'js/app.js', array('gsap-st'), false, true );
   }
   add\_action( 'wp\_enqueue\_scripts', 'theme\_gsap\_script' );
   ?>

We have a resource page dedicated to wordpress:

https://gsap.com/resources/Wordpress

 

Finally, please don't share the links to your private files, also if possible copy/paste all the bonus plugins you'll be using in your wordpress site in a single file and give it a different name, so people can't know that those are the GSAP bonus files, otherwise you're just giving away what you paid for. I edited your and @Cedec's post in order to remove those links.

 

Hopefully this helps.

Happy Tweening!