我的Shopify部分出現隨機JSON錯誤？

Question

我需要添加章節到一個頁面。聽我說。我知道這個話題已被擊敗，但我覺得我有答案，我只是不知道如何理解它。

I have been working hard to understand and implement the following tutorial in my client's store...... https://oak.works/blog/technical/2017/03/23/shopify-sections-editor/

我是全新的堆棧溢出，不是全新的Shopify或主題代碼，但我很綠。所以，請把它容易對我......到目前爲止，很多痛苦的研究，我已經確定（猜測），以下步驟是最有可能的途徑，這將導致成功：

1. making a new alternate page template, mine: page.portfolio.liquid
2. creating a snippet of the original section's code, just the top part (sans schema), mine: snippet-collection-callout.liquid
3. creating a new section, using the code (from the article) to render blocks into the section and calling the snippet for settings as shown in the tutorial I think? (BELOW, called section-portfolio-page.liquid)
4. defining the schema (copy and paste) from the original section collection-callout.liquid to the new section (BELOW, called section-portfolio-page.liquid)
5. calling the section into the new page template page.portfolio.liquid with {% section 'section-portfolio-page' %}
6. creating a new page in Shopify admin, "Portfolio Page"
7. assigning the new alternate page template to page.portfolio and ensuring navigation is there
8. navigate to the new page through theme editor, which should show a static section that I can enter and customize via blocks.

但我m卡在步驟4，因爲它踢着這個錯誤：

Error: Invalid JSON in tag 'schema'

我知道頁面上的部分是可能的。但我想哭。任何人都可以看看下面的文章，我的步驟和代碼，並將我推向正確的方向嗎？如果我的某個步驟有些錯誤，或者甚至只是解釋JSON錯誤的位置，請在閱讀完本文後告訴我。

我約173小時試圖弄清楚這一點，我的孩子沒有感到好笑。不開玩笑。任何幫助將不勝感激......

Here is the original section I am trying to recreate and piece together, for use on a page:

{%- assign collection = collections[section.settings.collection] -%} 
{%- assign isEmpty = false -%} 

{% if section.settings.collection == blank %} 
    {%- assign isEmpty = true -%} 
{% endif %} 

{% if section.settings.divider %}<div class="section--divider">{% endif %} 

<div class="page-width"> 
    <div class="feature-row feature-row--small-none"> 

    <div class="feature-row__item feature-row__callout-image"> 
     <div class="callout-images {% if isEmpty %}blank-state{% endif %}" data-aos="collection-callout"> 
     {% if isEmpty %} 
      {% for i in (1..5) %} 
      {% capture current %}{% cycle 1, 2, 3, 4, 5, 6 %}{% endcapture %} 
      <div class="callout-image">{{ 'product-' | append: current | placeholder_svg_tag: 'placeholder-svg' }}</div> 
      {% endfor %} 
     {% else %} 
      {% for product in collection.products limit: 5 %} 
      <img src="{{ product | img_url: '300x' }}" alt="{{ product.title }}" class="callout-image"> 
      {% endfor %} 
     {% endif %} 
     </div> 
    </div> 

    <div class="feature-row__item feature-row__text feature-row__text--{{ section.settings.layout }} feature-row__callout-text larger-text"> 
     {% if section.settings.subtitle %} 
     <p class="subtitle">{{ section.settings.subtitle }}</p> 
     {% endif %} 
     {% if section.settings.title != blank %} 
     <h2 class="h3">{{ section.settings.title }}</h3> 
     {% endif %} 
     <div class="rte"> 
     {% if section.settings.text != blank %} 
      <p>{{ section.settings.text }}</p> 
     {% endif %} 
     </div> 
     {% if section.settings.cta_text1 != blank %} 
     <a href="{{ section.settings.cta_link1 }}" class="btn"> 
      {{ section.settings.cta_text1 }} 
     </a> 
     {% endif %} 
     {% if section.settings.cta_text2 != blank %} 
     <a href="{{ section.settings.cta_link2 }}" class="btn"> 
      {{ section.settings.cta_text2 }} 
     </a> 
     {% endif %} 
    </div> 

    </div> 
</div> 

{% if section.settings.divider %}</div>{% endif %} 


{% schema %} 
    { 
    "name": "Collection callout", 
    "class": "index-section", 
    "settings": [ 
     { 
     "type": "collection", 
     "id": "collection", 
     "label": "Collection" 
     }, 
     { 
     "type": "text", 
     "id": "subtitle", 
     "label": "Subtitle", 
     "default": "Brand new" 
     }, 
     { 
     "type": "text", 
     "id": "title", 
     "label": "Title", 
     "default": "Collection callout" 
     }, 
     { 
     "type": "textarea", 
     "id": "text", 
     "label": "Text", 
     "default": "Use this section to easily call attention to one of your collections. We'll show photos of the first 5 products." 
     }, 
     { 
     "type": "text", 
     "id": "cta_text1", 
     "label": "Button #1 text", 
     "default": "Shop Jackets" 
     }, 
     { 
     "type": "url", 
     "id": "cta_link1", 
     "label": "Button #1 link" 
     }, 
     { 
     "type": "text", 
     "id": "cta_text2", 
     "label": "Button #2 text", 
     "default": "Shop All Mens" 
     }, 
     { 
     "type": "url", 
     "id": "cta_link2", 
     "label": "Button #2 link" 
     }, 
     { 
     "type": "select", 
     "id": "layout", 
     "label": "Layout", 
     "default": "right", 
     "options": [ 
      { 
      "value": "left", 
      "label": "Text on left" 
      }, 
      { 
      "value": "right", 
      "label": "Text on right" 
      } 
     ] 
     }, 
     { 
     "type": "checkbox", 
     "id": "divider", 
     "label": "Show section divider", 
     "default": false 
     } 
    ], 
    "presets": [{ 
     "name": "Collection callout", 
     "category": "Collection" 
    }] 
    } 
{% endschema %} 

Here is the code for the new section-portfolio-page.liquid I am trying to save, but getting an error for:

<div> 
{% for block in section.blocks %} 
<div class="grid-item" {{ block.shopify_attributes }}> 
    {% case block.type %} 

    {% when 'callout' %} 
    {% include 'snippet-collection-callout' %} 

    {% endcase %} 
</div> 
{% endfor %} 
</div> 

{% schema %} 
    { 
    "blocks": [ 
     { 
    "name": "Collection callout", 
    "class": "index-section", 
    "settings": [ 
     { 
     "type": "collection", 
     "id": "collection", 
     "label": "Collection" 
     }, 
     { 
     "type": "text", 
     "id": "subtitle", 
     "label": "Subtitle", 
     "default": "Brand new" 
     }, 
     { 
     "type": "text", 
     "id": "title", 
     "label": "Title", 
     "default": "Collection callout" 
     }, 
     { 
     "type": "textarea", 
     "id": "text", 
     "label": "Text", 
     "default": "Use this section to easily call attention to one of your collections. We'll show photos of the first 5 products." 
     }, 
     { 
     "type": "text", 
     "id": "cta_text1", 
     "label": "Button #1 text", 
     "default": "Shop Jackets" 
     }, 
     { 
     "type": "url", 
     "id": "cta_link1", 
     "label": "Button #1 link" 
     }, 
     { 
     "type": "text", 
     "id": "cta_text2", 
     "label": "Button #2 text", 
     "default": "Shop All Mens" 
     }, 
     { 
     "type": "url", 
     "id": "cta_link2", 
     "label": "Button #2 link" 
     }, 
     { 
     "type": "select", 
     "id": "layout", 
     "label": "Layout", 
     "default": "right", 
     "options": [ 
      { 
      "value": "left", 
      "label": "Text on left" 
      }, 
      { 
      "value": "right", 
      "label": "Text on right" 
      } 
     ] 
     }, 
     { 
     "type": "checkbox", 
     "id": "divider", 
     "label": "Show section divider", 
     "default": false 
     } 
    ], 
    "presets": [{ 
     "name": "Collection callout", 
     "category": "Collection" 
    }] 
    } 
{% endschema %} 

Answer 1

你失蹤2個支架。

這裏是正確的JSON模式：

{ 
    "blocks":[ 
     { 
     "name":"Collection callout", 
     "type":"collection", 
     "settings":[ 
      { 
       "type":"collection", 
       "id":"collection", 
       "label":"Collection" 
      }, 
      { 
       "type":"text", 
       "id":"subtitle", 
       "label":"Subtitle", 
       "default":"Brand new" 
      }, 
      { 
       "type":"text", 
       "id":"title", 
       "label":"Title", 
       "default":"Collection callout" 
      }, 
      { 
       "type":"textarea", 
       "id":"text", 
       "label":"Text", 
       "default":"Use this section to easily call attention to one of your collections. We'll show photos of the first 5 products." 
      }, 
      { 
       "type":"text", 
       "id":"cta_text1", 
       "label":"Button #1 text", 
       "default":"Shop Jackets" 
      }, 
      { 
       "type":"url", 
       "id":"cta_link1", 
       "label":"Button #1 link" 
      }, 
      { 
       "type":"text", 
       "id":"cta_text2", 
       "label":"Button #2 text", 
       "default":"Shop All Mens" 
      }, 
      { 
       "type":"url", 
       "id":"cta_link2", 
       "label":"Button #2 link" 
      }, 
      { 
       "type":"select", 
       "id":"layout", 
       "label":"Layout", 
       "default":"right", 
       "options":[ 
        { 
        "value":"left", 
        "label":"Text on left" 
        }, 
        { 
        "value":"right", 
        "label":"Text on right" 
        } 
       ] 
      }, 
      { 
       "type":"checkbox", 
       "id":"divider", 
       "label":"Show section divider", 
       "default":false 
      } 
     ] 
     } 
    ], 
    "presets":[ 
     { 
     "name":"Collection callout", 
     "category":"Collection" 
     } 
    ] 
} 

另外我添加了一個類型collection來將擋，因爲沒有類型。