Shopify光滑的滑块有部分有问题吗?

时间:2017-09-26 22:25:19

标签: json shopify liquid slick-slider shopify-app

我正在构建Shopify主题并添加光滑的滑块插件http://kenwheeler.github.io/slick/

我已经创建了模式json来设置Slider的内部和代码,但是无法开始工作。我收到一条错误消息:

15:48:35 [开发]资产执行更新到主页unique-legacy.myshopify.com上的sections / slick-silder.liquid
状态:422不可处理的实体 错误:标记“架构”中的无效JSON 15:48:58 [开发]资产config / settings_data.json基于忽略模式进行过滤

我的导师告诉我,JSON架构没有任何问题,但有些东西与创建的光滑滑块有关,但仍无法解决正在发生的事情。

解释代码:尝试创建的是一个带有光滑的自定义滑块,并按照它在新部分选项中的方式创建。

因此,使用主题的用户可以将滑块放在任何页面上并移动到底部或顶部。

有人可以解释,请

{% if section.blocks.size > 0 %}
<!-- Slick Slider Wrapper -->
<div class="carousel-wrapper" style="background-color: red;">
    <div class="carousel-info">
      <!-- Title Slider Wrapper -->
      <h3>{{ section.settings.carousel_title }}</h3>
      <!-- Description Wrapper -->
      <p>{{ section.settings.carousel_product_description }}</p>
      <!-- Button Wrapper -->
      <button>{{ section.settings.carousel_button_title }}</button>
    </div>

    <!-- Slick Slider -->
    <div id="carousel-{{ section.id }}" class="carousel" data-slick="autoplay">
    {% for block in section.blocks %}
        <div class="carousel-slide--{{ block.id }}" {{ block.shopify_attributes }} style="width:240px">
            {% if block.settings.carousel_image != blank %}
                    <img class="carousel_image--{{ block.id }}" src="{{ block.settings.carousel_image | img_url: '240x' }}" style="max-width:240px;display:inline-block;padding:40px">
            {% endif %}
        </div>
    {% endfor %}
    </div>
    <!-- ended of Slick Slider -->
  </div>

  </div>
  {% endif %}

  {% if section.blocks.size == 0 %}
    <div class="placeholder-noblocks">
        {{ 'homepage.onboarding.no_content' | t }}
    </div>
  {% endif %}

  <!-- Slick Slider Wrapper -->
{% 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 %}

1 个答案:

答案 0 :(得分:0)

您的JSON架构中有错误。

   {
     "type": "text",
     "id": "carousel_product_description",
     "label": "Carousel Description",
     "default: Carousel Main Description"
   },

"处没有结束default"处没有Carousel Main Description结束。

在此处验证您的JSON:https://jsonlint.com/您也会看到它。