title: Add arrows to slideshow on Shopify Debut theme Products
body: <p>I hope you can help me.
  <a href="https://i.stack.imgur.com/vZn8W.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/vZn8W.png" alt="enter image description here"></a>
  I am using Debut theme and this is my product and I would like to be able to put a slideshow on my product, to change images and variant if possible when I press the arrows (which I painted by my self for the example).</p>
  
  <pre><code>this.settings = {
        accessibility: true,
        arrows: true,
        dots: true,
        fade: true,
        draggable: true,
        touchThreshold: 20,
        autoplay: this.autorotate,
        autoplaySpeed: autoplaySpeed,
        // eslint-disable-next-line shopify/jquery-dollar-sign-reference
        appendDots: this.$arrows,
        customPaging: function(slick, index) {
          return (
            '&lt;a href="' +
            selectors.wrapper +
            sectionId +
            '" aria-label="' +
            loadSlideA11yString.replace('[slide_number]', index + 1) +
            '" data-slide-number="' +
            index +
            '"&gt;&lt;/a&gt;'
          );
        }
      };
  </code></pre>
  
  <p>As I was looking for what I needed was to change the value of the arrows var(which was false) to true in my theme.js file, as you can see I already did it but I still don't see results.</p>