title: Shopify slick slider with section have problems?
body: <p>I'm working building Shopify theme and adding the slick slider plugin <a href="http://kenwheeler.github.io/slick/" rel="nofollow noreferrer">http://kenwheeler.github.io/slick/</a>. </p>
  
  <p>I have created schema json for setting inside of and the code for Slider but cannot get to work. I'm getting an error message:</p>
  
  <blockquote>
  15:48:35 [development]Asset Perform Update to sections/slick-silder.liquid at host unique-legacy.myshopify.com</blockquote>
  
  <blockquote>Status: 422 Unprocessable Entity
  Errors: Invalid JSON in tag 'schema'
  
  15:48:58 [development]Asset config/settings_data.json filtered based on ignore patterns</blockquote>
  
  <p>My mentor told me that not anything wrong with JSON schema but something going own with the slick slider that created but still cannot wrap head around what going on. </p>
  
  <p><strong>Explain Code:</strong> What trying to create is a custom slider with slick and created in the way that it's inside the new section option.</p>
  
  <p>So the user that using the theme can put the slider on any page and move to bottom or top. </p>
  
  <p>Can someone explain to, please </p>
  
  <pre><code>{% if section.blocks.size &gt; 0 %}
  &lt;!-- Slick Slider Wrapper --&gt;
  &lt;div class="carousel-wrapper" style="background-color: red;"&gt;
      &lt;div class="carousel-info"&gt;
        &lt;!-- Title Slider Wrapper --&gt;
        &lt;h3&gt;{{ section.settings.carousel_title }}&lt;/h3&gt;
        &lt;!-- Description Wrapper --&gt;
        &lt;p&gt;{{ section.settings.carousel_product_description }}&lt;/p&gt;
        &lt;!-- Button Wrapper --&gt;
        &lt;button&gt;{{ section.settings.carousel_button_title }}&lt;/button&gt;
      &lt;/div&gt;
  
      &lt;!-- Slick Slider --&gt;
      &lt;div id="carousel-{{ section.id }}" class="carousel" data-slick="autoplay"&gt;
      {% for block in section.blocks %}
          &lt;div class="carousel-slide--{{ block.id }}" {{ block.shopify_attributes }} style="width:240px"&gt;
              {% if block.settings.carousel_image != blank %}
                      &lt;img class="carousel_image--{{ block.id }}" src="{{ block.settings.carousel_image | img_url: '240x' }}" style="max-width:240px;display:inline-block;padding:40px"&gt;
              {% endif %}
          &lt;/div&gt;
      {% endfor %}
      &lt;/div&gt;
      &lt;!-- ended of Slick Slider --&gt;
    &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;!-- Slick Slider Wrapper --&gt;
  </code></pre>
  
  <hr>
  
  <pre><code>{% schema %}
  {
         "name": "Carousel Images",
         "max_blocks": 8,
         "settings": [
         {
            "type":"header",
            "content":"Carousel option"
         },
         {
            "type":"text",
            "id":"carousel_title",
            "label":"Carousel title",
            "default":"Carousel main title"
         },
         {
           "type": "text",
           "id": "carousel_title",
           "label":"Carousel title",
           "default":"Carousel main title"
         },
         {
           "type": "text",
           "id": "carousel_product_description",
           "label": "Carousel Description",
           "default: Carousel Main Description"
         },
         {
           "type": "url",
           "id": "carousel_link",
           "label": "Carousel title link"
         },
         {
            "type":"header",
            "content":"In depth carousel option"
         },
         {
           "type": "checkbox",
           "id": "carousel_autoplay",
           "label": "Auto-rotate slides",
           "default": false
         },
         {
            "type":"color",
            "id":"carousel_bg",
            "label":"Carousel background",
            "default":"#fff"
         }
       ],
       "blocks": [
         {
           "type": "image",
           "name": "Image slide",
           "settings": [
             {
               "type": "image_picker",
               "id": "carousel_image",
               "label": "Image"
             },
             {
               "type": "url",
               "id": "slide_link",
               "label": "Slide link"
             }
           ]
         }
       ],
       "presets": [{
         "name": "Carousel",
         "category": "Image",
         "settings": {
           "carousel_autoplay": false
         },
         "blocks": [
           {
             "type": "image"
           },
           {
             "type": "image"
           },
           {
             "type": "image"
           },
           {
             "type": "image"
           },
           {
             "type": "image"
           },
           {
             "type": "image"
           }
         ]
       }]
     }
  {% endschema %}
  </code></pre>