Bootstrap 4 Free Ecommerce Template

Aria Bootstrap 4 is a free BS4 e-commerce template for clothing stores. Tech Stack – HTML/CSS, JavaScript, SASS, Bootstrap.

free bootstrap ecommerce template, responsive ecommerce website templates free download html with css, bootstrap 4 ecommerce html template

Features:

Based on jQuery and Bootstrap.
Gallery (product) images with fancy hovering effects.
Parallax scrolling effect.
Smooth scrolling and spy scrolling.
And much more…

How to make use of it:

1. Include jQuery, Bootstrap, and other required assets on the web page.

<!-- Bootstrap -->
<link rel="stylesheet" href="/path/to/cdn/bootstrap.min.css" />
<script src="/path/to/cdn/jquery.min.js"></script>
<script src="/path/to/cdn/bootstrap.min.js"></script>

<!-- Font Awesome -->
<link href="/path/to/fontawesome/all.css" rel="stylesheet" />

<!-- Google Fonts -->
<link href="https://fonts.googleapis.com/css?family=Indie+Flower|Montserrat|Raleway|Roboto|Pacifico" rel="stylesheet" />

<!-- Custom CSS -->
<link href="assets/css/style.css" rel="stylesheet" />

<!-- jQuery Easing -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.4.1/jquery.easing.min.js"></script>

2. Custom scripts for this template.

(function ($) {
  "use strict"; // Start of use strict

  // Smooth scrolling using jQuery easing
  $('a.js-scroll-trigger[href*="#"]:not([href="#"])').click(function () {
      if (
          location.pathname.replace(/^\//, "") ==
          this.pathname.replace(/^\//, "") &&
          location.hostname == this.hostname
      ) {
          var target = $(this.hash);
          target = target.length
              ? target
              : $("[name=" + this.hash.slice(1) + "]");
          if (target.length) {
              $("html, body").animate(
                  {
                      scrollTop: target.offset().top - 70,
                  },
                  1000,
                  "easeInOutExpo"
              );
              return false;
          }
      }
  });

  // Activate scrollspy to add active class to navbar items on scroll
  $("body").scrollspy({
      target: "#mainNav",
      offset: 100,
  });

  // Collapse Navbar
  var navbarCollapse = function () {
      if ($("#mainNav").offset().top > 100) {
          $("#mainNav").addClass("navbar-shrink");
      } else {
          $("#mainNav").removeClass("navbar-shrink");
      }
  };

  // Collapse now if page is not at top
  navbarCollapse();

  // Collapse the navbar when page is scrolled
  $(window).scroll(navbarCollapse);
  
})(jQuery); // End of use strict

Modern E-commerce Web Template, aria-bootstrap4 Plugin/Github, online shopping website templates free download html with css