title: Implement a button on the Shopify Debut theme carousel
body: <p>Is there a way to implement a button onto the slider on the Debut theme? I just want it to route to a particular page. Here is the code:</p>
  
  <pre><code>&lt;div data-section-id="{{ section.id }}" data-section-type="slideshow-section"&gt;
  
    {% if section.blocks.size &gt; 0 %}
      &lt;div class="slideshow-wrapper"&gt;
        &lt;button type="button" class="visually-hidden slideshow__pause" data-id="{{ section.id }}" aria-live="polite"&gt;
          &lt;span class="slideshow__pause-stop"&gt;
            {% include 'icon-pause' %}
            &lt;span class="icon__fallback-text"&gt;{{ 'sections.slideshow.pause_slideshow' | t }}&lt;/span&gt;
          &lt;/span&gt;
          &lt;span class="slideshow__pause-play"&gt;
            {% include 'icon-play' %}
            &lt;span class="icon__fallback-text"&gt;{{ 'sections.slideshow.play_slideshow' | t }}&lt;/span&gt;
          &lt;/span&gt;
        &lt;/button&gt;
  
        &lt;div class="slideshow slideshow--{{ section.settings.slideshow_height }}" id="Slideshow-{{ section.id }}" data-autoplay="{{ section.settings.autoplay }}" data-speed="{{ section.settings.autoplay_speed }}"&gt;
          {% for block in section.blocks %}
            {%- assign is_background_video = false -%}
            {% if block.type == 'video' %}
              {% if block.settings.video_type == 'background' or block.settings.video_type =='background-chrome' %}
                {%- assign is_background_video = true -%}
              {% endif %}
            {% endif %}
  
            &lt;div class="slideshow__slide slideshow__slide--{{ block.id }}{% if is_background_video %} slideshow__slide--background-video{% endif %}" {{ block.shopify_attributes }}&gt;
              {% if block.settings.link != blank %}
                &lt;a href="{{ block.settings.link }}" class="slideshow__link"&gt;
              {% endif %}
  
              {% if block.type == 'video' %}
                {% if block.settings.video_url != blank %}
                  &lt;div class="video-loader"&gt;&lt;/div&gt;
                {% endif %}
                {% unless block.settings.video_type == 'background' %}
                  &lt;button type="button" class="text-link slideshow__video-control slideshow__video-control--close" data-controls="SlideshowVideo-{{ block.id }}"&gt;
                    {% include 'icon-close' %}
                    &lt;span class="icon__fallback-text"&gt;{{ 'sections.slideshow.close_video' | t }}&lt;/span&gt;
                  &lt;/button&gt;
                {% endunless %}
                {% if block.settings.video_url != blank %}
                  &lt;div id="SlideshowVideo-{{ block.id }}" class="slideshow__video {% if is_background_video %}slideshow__video--background{% endif %} slideshow__video--{{ block.settings.video_type }}"
                    data-id="{{ block.settings.video_url.id }}"
                    data-type="{{ block.settings.video_type }}"
                    data-slideshow="Slideshow-{{ section.id }}"&gt;&lt;/div&gt;
                {% endif %}
              {% endif %}
  
              {% if block.settings.image == blank %}
                &lt;div class="slideshow__image js"&gt;
                  &lt;div class="placeholder-background"&gt;
                    {% capture current %}{% cycle 1, 2 %}{% endcapture %}
                    {{ 'lifestyle-' | append: current | placeholder_svg_tag: 'placeholder-svg' }}
                  &lt;/div&gt;
                &lt;/div&gt;
              {% else %}
                &lt;div class="slideshow__image box ratio-container lazyload{% unless forloop.first == true %} lazypreload{% endunless %} js"
                     data-bgset="{% include 'bgset', image: block.settings.image %}"
                     data-sizes="auto"
                     data-parent-fit="cover"
                     style="background-position: {{ block.settings.alignment }};{% if forloop.first == true %} background-image: url('{{ block.settings.image | img_url: '300x300' }});{% endif %}"&gt;
                &lt;/div&gt;
              {% endif %}
  
              &lt;noscript&gt;
                &lt;div class="slideshow__image"{% if block.settings.image %} style="background-image: url('{{ block.settings.image | img_url: '2048x' }}'); background-position: {{ block.settings.alignment }};"{% endif %}&gt;
                  {% if block.settings.image == blank %}
                    &lt;div class="placeholder-background"&gt;
                      {% capture current %}{% cycle 1, 2 %}{% endcapture %}
                      {{ 'lifestyle-' | append: current | placeholder_svg_tag: 'placeholder-svg' }}
                    &lt;/div&gt;
                  {% endif %}
                &lt;/div&gt;
              &lt;/noscript&gt;
              &lt;div class="slideshow__text-wrap{% if block.settings.title != blank or block.settings.subheading != blank %} slideshow__overlay{% endif %}"&gt;
                &lt;div class="slideshow__text-content"&gt;
                  &lt;div class="page-width"&gt;
                    {% unless block.settings.title == blank %}
                      &lt;h2 class="h1 mega-title slideshow__title{% if settings.link != blank %} slideshow__title--has-link{% endif %}{% if section.settings.text_size == 'large' %} mega-title--large{% endif %}"&gt;
                        {{ block.settings.title | escape }}
                      &lt;/h2&gt;
                    {% endunless %}
                    {% unless block.settings.subheading == blank %}
                      &lt;span class="mega-subtitle slideshow__subtitle{% if section.settings.text_size == 'large' %} mega-subtitle--large{% endif %}"&gt;
                        {{ block.settings.subheading | escape }}
                      &lt;/span&gt;
                    {% endunless %}
                    {% if block.type == 'video' %}
                      {% unless block.settings.video_type == 'background' %}
                        &lt;div class="slideshow__video-control--play-wrapper{% if block.settings.title != blank or block.settings.subheading != blank %} slideshow__video-control--play-wrapper--push{% endif %}"&gt;
                          &lt;button type="button" class="text-link slideshow__video-control slideshow__video-control--play" data-controls="SlideshowVideo-{{ block.id }}"&gt;
                            {% include 'icon-play-video' %}
                            &lt;span class="icon__fallback-text"&gt;{{ 'sections.slideshow.play_video' | t }}&lt;/span&gt;
                          &lt;/button&gt;
                        &lt;/div&gt;
                      {% endunless %}
                    {% endif %}
                  &lt;/div&gt;
                &lt;/div&gt;
              &lt;/div&gt;
  
              {% if block.settings.link != blank %}
                &lt;/a&gt;
              {% endif %}
            &lt;/div&gt;
          {% endfor %}
        &lt;/div&gt;
      &lt;/div&gt;
    {% endif %}
  
    {% if section.blocks.size == 0 %}
      &lt;div class="placeholder-noblocks"&gt;
        {{ 'homepage.onboarding.no_content' | t }}
      &lt;/div&gt;
    {% endif %}
  &lt;/div&gt;
  </code></pre>