Jump to content
Search Community

Wordpress oxygen builder and using Gsap

GingerPrince test
Moderator Tag

Recommended Posts

Hey GingerPrince and welcome to the GreenSock forums.

 

GSAP can be included like any other JavaScript library. As for how to do that with that particular plugin, I would ask the creators as I've never used it before :) Perhaps it'd also help to start out with the GSAP Getting Started article:

 

 

  • Like 1
Link to comment
Share on other sites

On 12/4/2020 at 5:30 PM, GingerPrince said:

Hi I'm looking to use GSAP especially the scroll trigger functionality on a Wordpress site.. and ideally looking to build the hotel etc up in oxygenbuilder https://oxygenbuilder.com. How do you get the GSAP library set up so its can be used min Wordpress and ideally though a  builder like oxygen? Any help getting it set up would be great. : )

 

I use gsap easily with oxygen and it works fine, once you have the cdn, with the codeblocks in the pages you can do everything from the javascript tab

  • Like 3
Link to comment
Share on other sites

  • 7 months later...
On 12/8/2020 at 9:37 AM, acipriani said:

Yes it is a good suggestion I for external scripts I use a fantastic "advanced script" plugin where you can control very well what you have to load, but there are other methods as well

so, after installing gsap in Oxygen Builder via Advanced Scripts, and building some wonky animations using the CDN I then refined/rebuilt the script I intended to have using Codepen. After seeing it work as intended I then applied the code to my site. As before, I again received the Uncaught ReferenceError.. both trying to use the local and CDN... (can't remember what i did to get the first bit of code to work on the site (blushes) probably held my tongue in the right position.)

 

Under the "Network" tab in the inspector you can see that the gsap.min.js is loaded however, im not sure that means very much.. do I need to register gsap as I am a Club Member or do I need to import a module to use TimeLines or have I simply coded something wrong (Oxygen vs Codepen)??

Also to add. when installing gsap locally thru Advanced Scripts in Oxygen Builder it renamed the files gsap.min_.js.. not sure if that has an effect so I went into the cPanel and changed all the gsap files to (.)js.. didn't change the results tho. (Note: i never got gsap to work on local install only CDN )

 

 

See the Pen KKmovbW by MrBoboToast (@MrBoboToast) on CodePen

 

 

error_gsap.jpg

gsap_loaded.jpg

Link to comment
Share on other sites

3 hours ago, Ezahnin said:

do I need to register gsap as I am a Club Member or do I need to import a module to use TimeLines or have I simply coded something wrong (Oxygen vs Codepen)??

Also to add. when installing gsap locally thru Advanced Scripts in Oxygen Builder it renamed the files gsap.min_.js.. not sure if that has an effect so I went into the cPanel and changed all the gsap files to (.)js.. didn't change the results tho. (Note: i never got gsap to work on local install only CDN )

 

No, you don't need to register anything, and the name of the file doesn't matter. Your error means gsap isn't loaded, or is loaded after your animation script. You need to make sure your GSAP scripts are placed before your animation script.

 

Link to comment
Share on other sites

NICE!! and thank you.. the difference of loading gsap.min.js in the head vs footer <blushes>...

That was the fix, thanks again so much.

Oh, and I apologies for the Horrible class naming.. I am working on that.. ( reading up on BEM )

  • Like 2
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...