Natalie Posted April 4, 2020 Share Posted April 4, 2020 Hi, I am not a javascript expert but I need to add Greensock Tweenmax to my wordpress website via my Child Theme. I've seen so many different sources explaining different ways of doing this but none have worked. Can anyone explain this OR send me to a resource that's going to work for me? Right now I have installed this code into my <body> tag: <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.2.6/gsap.min.js"></script> And this into <footer>: <script src="<?php echo get_template_directory_uri(); ?>/app.js"></script> I created a new file in my child theme folder called app.js, and in my child theme functions.php, tried to encue it as so: function my_custom_scripts() { wp_enqueue_script( 'app-js', get_stylesheet_directory_uri() . '/app.js', array( 'jquery' ),'',true ); } add_action( 'wp_enqueue_scripts', 'my_custom_scripts' ); Link to comment Share on other sites More sharing options...
PointC Posted April 4, 2020 Share Posted April 4, 2020 I think this thread can help. 2 Link to comment Share on other sites More sharing options...
Natalie Posted April 4, 2020 Author Share Posted April 4, 2020 Thanks. I saw that but was pretty confused by it. I'll try to do more research about each of their suggestions. Link to comment Share on other sites More sharing options...
Natalie Posted April 4, 2020 Author Share Posted April 4, 2020 15 minutes ago, Natalie said: Hi, I am not a javascript expert but I need to add Greensock Tweenmax to my wordpress website via my Child Theme. I've seen so many different sources explaining different ways of doing this but none have worked. Can anyone explain this OR send me to a resource that's going to work for me? Right now I have installed this code into my <body> tag: <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.2.6/gsap.min.js"></script> And this into <footer>: <script src="<?php echo get_template_directory_uri(); ?>/app.js"></script> I created a new file in my child theme folder called app.js, and in my child theme functions.php, tried to encue it as so: function my_custom_scripts() { wp_enqueue_script( 'app-js', get_stylesheet_directory_uri() . '/app.js', array( 'jquery' ),'',true ); } add_action( 'wp_enqueue_scripts', 'my_custom_scripts' ); EDIT: This is what my Dev Tools says. Link to comment Share on other sites More sharing options...
PointC Posted April 4, 2020 Share Posted April 4, 2020 I'm not much of a WordPress user but that error strikes me as odd. You're loading gsap 3.2.6, but the error says TimelineMax is not defined? I would have expected the error to say gsap is not defined. I wish I could be of more help, but I just don't have a WP background. Maybe someone with more WordPress expertise will pop up with some ideas. There are other threads about this topic throughout the forum too. If you use the search feature, you should find some additional info that may be helpful. 1 Link to comment Share on other sites More sharing options...
PointC Posted April 4, 2020 Share Posted April 4, 2020 I guess if you're using the old syntax, it would say TimelineMax is not defined. But I assumed you were using the new syntax which would result in gsap not defined. In either case, I'm not able to help much. Link to comment Share on other sites More sharing options...
GreenSock Posted April 5, 2020 Share Posted April 5, 2020 Quote Right now I have installed this code into my <body> tag: <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.2.6/gsap.min.js"></script> Are you 100% positive? And was that GSAP file loaded BEFORE the code that references TimelineMax? Did you check the source of the page that's displaying that error (I mean in the browser, right click, view source)? If you are indeed loading that on a page then TimelineMax will be defined (after it's loaded of course). So it's either an order issue (you're referencing TimelineMax before the file loads) or you're not loading GSAP or maybe the code that's looking for TimelineMax is in a different iframe or something, thus it doesn't have access to GSAP from that page. Very difficult to troubleshoot blind. 2 Link to comment Share on other sites More sharing options...
Recommended Posts
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 accountSign in
Already have an account? Sign in here.
Sign In Now