2017-09-23 1 views
0

Je construis un slick slick en utilisant la nouvelle section Shopify. Tout ce que vous voulez, c'est ajouter l'image qui a la flèche va à gauche et à droite.Erreurs: JSON non valide dans la balise 'schéma' (Shopify Slick Sider)

Avec un titre, une description, et le bouton que l'utilisateur peut modifier et ajouter le lien vers tout avec être au-dessus du carrousel et changer avec tout quelques clics de souris sur les boutons fléchés ou fantômes au fond

Voici une capture d'écran .

enter image description here

{% 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": {{ section.settings.carousel_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", 
    "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 %} 
+0

Vous devriez essayer de valider votre json. Il semble que la ligne 9 vous manque une accolade. – slowjack2k

+0

@ slowjack2k Je valide le fichier json mais je ne sais pas ce que cela signifie. 'Erreur: erreur d'analyse en ligne 14: ... Titre "\t \t}, \t \t "type": "texte", \t \t "id":" c ------------ ---------^ Attendant 'EOF', '}', ',', ']', got ':' ' –

+0

Votre absence une accolade ouverte avant" type " – slowjack2k

Répondre

0

Vous manque une a été accolade ouverte avant le type de texte et deux points après le deuxième objet de type.

 { 
     "name": "Carousel", 
     "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" 
      } 
     ] 
     }] 
    }