Shopify slider codes

Shopify slider codes

{% assign slider_enabled = true %}
<div class="clear full column separator" id="Slider">
  	<ul class="rslides">
  		{% for i in (1..6) %}
          {% capture slide %}slide_{{ i }}{% endcapture %}
          {% capture slide_link %}slide_{{ i }}_link{% endcapture %}
          {% capture slide_img %}slide_{{ i }}.jpg{% endcapture %}
          {% capture slide_alt %}slide_{{ i }}_alt{% endcapture %}
          {% if settings[slide] %}
            <li>
              <a href="{{ settings[slide_link] }}" class="slide-link">
                {{ slide_img | asset_url | img_tag: settings[slide_alt] }}
              </a>
            </li>
          {% endif %}
        {% endfor %}
	</ul>
</div>

<script src="https://cdnjs.cloudflare.com/ajax/libs/ResponsiveSlides.js/1.53/responsiveslides.min.js"></script>
<script>
  $(function() {
    $(".rslides").responsiveSlides();
  });
</script>




{  
      "name":"Home page - slideshow",
      "settings":[  
         {  
            "type":"checkbox",
            "id":"slider_home_auto",
            "label":"Auto-rotate slides"
         },
         {  
            "type":"checkbox",
            "id":"slider_home_show_dots",
            "label":"Show dot indicators"
         },
         {  
            "type":"select",
            "id":"slider_home_rate",
            "label":"Rotation interval",
            "options":[  
               {  
                  "value":"3000",
                  "label":"3 seconds"
               },
               {  
                  "value":"4000",
                  "label":"4 seconds"
               },
               {  
                  "value":"5000",
                  "label":"5 seconds"
               },
               {  
                  "value":"7000",
                  "label":"7 seconds"
               },
               {  
                  "value":"10000",
                  "label":"10 seconds"
               },
               {  
                  "value":"15000",
                  "label":"15 seconds"
               }
            ]
         },
         {  
            "type":"select",
            "id":"slider_home_transition",
            "label":"Transition effect",
            "options":[  
               {  
                  "value":"fade",
                  "label":"Fade"
               },
               {  
                  "value":"slide",
                  "label":"Slide"
               }
            ]
         },
         {  
            "type":"header",
            "content":"Slide 1"
         },
         {  
            "type":"checkbox",
            "id":"slide_1",
            "label":"Enable"
         },
         {  
            "type":"image",
            "id":"slide_1.jpg",
            "label":"Image",
            "max-width":1920,
            "info":"1280 x 460px recommended"
         },
         {  
            "type":"text",
            "id":"slide_1_link",
            "label":"Link URL"
         },
         {  
            "type":"text",
            "id":"slide_1_alt",
            "label":"Alt text"
         },
         {  
            "type":"header",
            "content":"Slide 2"
         },
         {  
            "type":"checkbox",
            "id":"slide_2",
            "label":"Enable"
         },
         {  
            "type":"image",
            "id":"slide_2.jpg",
            "label":"Image",
            "max-width":1920,
            "info":"1280 x 460px recommended"
         },
         {  
            "type":"text",
            "id":"slide_2_link",
            "label":"Link URL"
         },
         {  
            "type":"text",
            "id":"slide_2_alt",
            "label":"Alt text"
         },
         {  
            "type":"header",
            "content":"Slide 3"
         },
         {  
            "type":"checkbox",
            "id":"slide_3",
            "label":"Enable"
         },
         {  
            "type":"image",
            "id":"slide_3.jpg",
            "label":"Image",
            "max-width":1920,
            "info":"1280 x 460px recommended"
         },
         {  
            "type":"text",
            "id":"slide_3_link",
            "label":"Link URL"
         },
         {  
            "type":"text",
            "id":"slide_3_alt",
            "label":"Alt text"
         },
         {  
            "type":"header",
            "content":"Slide 4"
         },
         {  
            "type":"checkbox",
            "id":"slide_4",
            "label":"Enable"
         },
         {  
            "type":"image",
            "id":"slide_4.jpg",
            "label":"Image",
            "max-width":1920,
            "info":"1280 x 460px recommended"
         },
         {  
            "type":"text",
            "id":"slide_4_link",
            "label":"Link URL"
         },
         {  
            "type":"text",
            "id":"slide_4_alt",
            "label":"Alt text"
         },
         {  
            "type":"header",
            "content":"Slide 5"
         },
         {  
            "type":"checkbox",
            "id":"slide_5",
            "label":"Enable"
         },
         {  
            "type":"image",
            "id":"slide_5.jpg",
            "label":"Image",
            "max-width":1920,
            "info":"1280 x 460px recommended"
         },
         {  
            "type":"text",
            "id":"slide_5_link",
            "label":"Link URL"
         },
         {  
            "type":"text",
            "id":"slide_5_alt",
            "label":"Alt text"
         },
         {  
            "type":"header",
            "content":"Slide 6"
         },
         {  
            "type":"checkbox",
            "id":"slide_6",
            "label":"Enable"
         },
         {  
            "type":"image",
            "id":"slide_6.jpg",
            "label":"Image",
            "max-width":1920,
            "info":"1280 x 460px recommended"
         },
         {  
            "type":"text",
            "id":"slide_6_link",
            "label":"Link URL"
         },
         {  
            "type":"text",
            "id":"slide_6_alt",
            "label":"Alt text"
         }
      ]
   },




.rslides {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 0;
  }

.rslides li {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;
  }

.rslides li:first-child {
  position: relative;
  display: block;
  float: left;
  }

.rslides img {
  display: block;
  height: auto;
  float: left;
  width: 100%;
  border: 0;
  }