Automate on Scroll (aos) doesn’t load in WordPress

I am struggling with any task requiring the smallest bit of brain function. The task I’m currently struggling with is adding the AOS library to my site on WordPress.

I added the following code to my full-width-page.php template in the WordPress Editor:

<script> AOS.init(); </script>

In addition, I added the following code under Appearance > Theme Settings > Style > External JS field & External CSS field

<script src="uploads/aos-master/dist/aos.js"></script>

<link rel="stylesheet" type="text/css" href="uploads/aos-master/dist/aos.css">

After all of that, I put the data-aos attribute to html element that I want to animate, like so:

<div data-aos="fade-up";>
<h2>TEST TEST TEST</h2>
</div>

But then… nothing happens ;(

Please, if it’s possible to set up, share with me what I’m doing wrong.

Answer

Are you sure aos stylesheet and javascript file loaded correctly? You can use Chrome’s or Firefox’s debugger on page (Chrome’s Shortcut is Ctrl(or CMD)+Shift+i)

also you can change stylesheet and javascript file codes with code below;

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/aos/2.2.0/aos.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/aos/2.2.0/aos.js"></script>

Advertisement

Answer