let SwiperSlider = new Swiper('.swiper', {

  // Your swiper settings
  loop: true,
  slidesPerView: 1,
  speed: 350,
  spaceBetween: 50,

  // Pagination is where you will add the code to automaitaclly label each slider button

  pagination: {
    el: '.swiper-pagination_container', // div that will hold the slider buttons
    clickable: true,
    bulletClass: 'swiper-button', // slider button class
    bulletActiveClass: 'is-active', // sub class for the active slider button

    // The fancy code part
    renderBullet: function (index, className) {
      // find all the slides in the slider
      let slide = this.slides[index];
      // Get the value from the data-slide-name attribute that is on each slide
      let slideName = slide.getAttribute('data-slide-name');
      // Create a slider button using the classes above and add the slider name in a span within the element.
      return '<span class="' + className + '" data-slide-name="' + slideName + '">' + slideName + '</span>';
    },
  },

});