Add swiper to hugo

0
votes

I would like to add swiper to make a slider to my test project, tha is based on hugo framework. Unfortunately, it doesn;t work correctly. Here is my github projects: https://github.com/bullet03/carousel_site

What I've done:

  1. Created a structure in layouts/_default/baseof.html, where i put partials/head.html and partials/header.html
  2. in partials/head.html i added css styles for swiper and css for my code

<link
  rel="stylesheet"
  href="https://unpkg.com/swiper/swiper-bundle.min.css"
/>
  1. in partials/header.html i inserted partials/carousel.html
  2. in partials/carousel.html i added html structure, at the end added js scripts for swiper

<!-- Swiper JS -->
<script src="https://unpkg.com/swiper/swiper-bundle.min.js"></script>

<!-- Initialize Swiper -->
<script>
  var swiper = new Swiper(".mySwiper", {});
</script>

My css do not load, there is no mistake, it's just like there is no swiper and styles at all. Could you kindly, point out, how to fix it?

javascriptcsssliderswiperhugo