uavide Posted July 7, 2022 Share Posted July 7, 2022 Good morning, i add this code in the code elements of a wordpress builder and it works:So i get the gsap library from cdn link and i add a simple gsap animation to an image with a specific class. <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.10.4/gsap.min.js"></script> <script> gsap.to(".lago2", {duration: 2, x: 200, ease: "bounce"}); </script> <style> .lago2 { width:180px; } </style> <img class="lago2" src="/wp-content/uploads/2022/07/logo.jpg" alt="" width="180" height="180" /> i discovered that it’s better to add the js libraries (gsap) with enqueue in function.php of wordpressSo i tried to add to the function.php this code: function wpb_adding_scripts(){ wp_register_script( 'gsap', 'https://cdnjs.cloudflare.com/ajax/libs/gsap/3.10.4/gsap.min.js', array(), '1.0', true ); wp_enqueue_script('gsap'); } add_action( 'wp_enqueue_scripts', 'wpb_adding_scripts' ); and i remove from the code elements in the builder the script src about the cdn link.So my code in the code element in the builder (in wordpress) it’s like this: <script> gsap.to(".lago2", {duration: 2, x: 200, ease: "bounce"}); </script> <style> .lago2 { width:180px; } </style> <img class="lago2" src="/wp-content/uploads/2022/07/logo.jpg" alt="" width="180" height="180" /> But it doesn't work...so i thought that maybe my enqueue code in function.php it's wrong. What do you think? could you help me to understand? Many thanks Davide Link to comment Share on other sites More sharing options...
SteveS Posted July 7, 2022 Share Posted July 7, 2022 This is more of a wordpress questions than a gsap question. There should be a copy paste solution online for this particular issue. As someone who worked with WordPress for a few years and currently does GSAP work on WordPress sites, I think it's easier to just use a script management plugin. 1 Link to comment Share on other sites More sharing options...
uavide Posted July 7, 2022 Author Share Posted July 7, 2022 yes i know, thanks...but finally i found the solutions and i think could be helpful for all the people in the forum that use wordpress and they want to integrate GSAP by enqueue in function.php function theme_gsap_script() { wp_enqueue_script( 'gsap-js', 'https://cdnjs.cloudflare.com/.../gsap/3.10.4/gsap.min.js', array(), false, true ); wp_enqueue_script( 'gsap-script', get_stylesheet_directory_uri() . '/js/gsap-scripts.js', array(), false, true ); } add_action( 'wp_enqueue_scripts', 'theme_gsap_script' ); 1 1 Link to comment Share on other sites More sharing options...
LondonPete Posted January 4 Share Posted January 4 Uavid, can you tell me if you actually put anything in the /js/gsap-scripts.js file? I'm not sure what the second enqueue is for. Many thanks Link to comment Share on other sites More sharing options...
Cassie Posted January 4 Share Posted January 4 Hi - this thread is a year old so you may not get a response, if you're struggling we have a guide here https://gsap.com/resources/Wordpress/ From a glance he's enqueuing the GSAP library and a JS file with his own code in Link to comment Share on other sites More sharing options...
LondonPete Posted January 4 Share Posted January 4 Thanks so much, it's all working now. 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