- This topic has 10 replies, 2 voices, and was last updated 6 years, 1 month ago by Tom.
-
AuthorPosts
-
February 10, 2018 at 11:20 am #493120Margot
I’m having trouble embedding a piece of script from the AOS Library using GP Hooks as well as through the functions.php page. I’ve tried both but they don’t work.
This is what I’ve tried in GP Hooks:
<link href="https://cdn.rawgit.com/michalsnik/aos/2.1.1/dist/aos.css" rel="stylesheet"> <script src="https://cdn.rawgit.com/michalsnik/aos/2.1.1/dist/aos.js"></script> <script>AOS.init();</script>
I’ve also tried putting an enqueue function in my child theme functions.php file:
function register_scripts_and_styles() { wp_enqueue_style('AOS_animate', 'https://cdn.rawgit.com/michalsnik/aos/2.1.1/dist/aos.css', false, null); wp_enqueue_script('AOS', 'https://cdn.rawgit.com/michalsnik/aos/2.1.1/dist/aos.js', false, null, true); wp_enqueue_script('theme-js', 'http://myurl/folder/wp-content/themes/generatepress_child/aosini.js', ['AOS'], null, true); }
with the aosini.js file having this code:
AOS.init();
But neither of these options are working for me. Could it be that the script I’m trying to use is incompatible with GP?
February 10, 2018 at 9:27 pm #493358TomLead DeveloperLead DeveloperIn the second snippet,
['AOS']
should bearray( 'AOS' )
.What’s the library supposed to do?
February 11, 2018 at 6:57 am #493577MargotI tried that change you mentioned but that didn’t seem to work for me either.
It’s basically a small library that gives you the ability to animate individual elements on your page as you scroll down. Here’s a sample page > https://michalsnik.github.io/aos/
February 11, 2018 at 8:47 pm #494013TomLead DeveloperLead DeveloperIs your code still added to the site? I’m not seeing it anywhere.
If not, can you re-add it so I can see why it’s not working?
Thanks!
February 12, 2018 at 6:53 am #494434MargotNo problem. I got it back up. I applied the effect only to this div:
<div class="homepage-intro-text">
the tag that controls the effect is data-aos=”fade-up”February 12, 2018 at 9:44 am #494562TomLead DeveloperLead DeveloperHmm, still not seeing the files loaded. Which method are you using to load them?
February 12, 2018 at 10:21 am #494600MargotThat’s strange… But that might explain part of the problem… I used this >
function register_scripts_and_styles() { wp_enqueue_style('AOS_animate', 'https://cdn.rawgit.com/michalsnik/aos/2.1.1/dist/aos.css', false, null); wp_enqueue_script('AOS', 'https://cdn.rawgit.com/michalsnik/aos/2.1.1/dist/aos.js', false, null, true); wp_enqueue_script('theme-js', 'http://myurl/folder/wp-content/themes/generatepress_child/aosini.js', array( 'AOS' ), null, true); }
in my child theme functions.php document
February 12, 2018 at 8:34 pm #494899TomLead DeveloperLead DeveloperAh, you need to do this:
add_action( 'wp_enqueue_scripts', 'tu_add_aos' ); function tu_add_aos() { wp_enqueue_style('AOS_animate', 'https://cdn.rawgit.com/michalsnik/aos/2.1.1/dist/aos.css', false, null); wp_enqueue_script('AOS', 'https://cdn.rawgit.com/michalsnik/aos/2.1.1/dist/aos.js', false, null, true); wp_enqueue_script('theme-js', 'http://myurl/folder/wp-content/themes/generatepress_child/aosini.js', array( 'AOS' ), null, true); }
February 13, 2018 at 6:59 am #495303MargotThat worked. Thank you so much! You’re awesome!
February 13, 2018 at 7:00 am #495304Margotps. the script works perfect with GP!
February 13, 2018 at 9:26 am #495452TomLead DeveloperLead DeveloperAwesome! Glad I could help! 🙂
-
AuthorPosts
- You must be logged in to reply to this topic.