프론트앤드/Shopify

[JSON Template] 404-template schema (1-2)

헬리이 2023. 8. 26. 22:40
728x90

이 전 내용과 이어진다.

이번에는 이 전에 적용했던 코드에서 schema를 적용하고 바꿔서 

커스터마이징까지 할 수있게 바꾸어 보았다 !

 

 

 

{% schema %}
  {
    "name": "Template-404",
    "settings": [
      {
        "type": "text",
        "id": "title",
        "default": "404",
        "label": "404 Heading Title"

      }
    ]
  }
{% endschema %}

 

//같은 파일 내
//여기는 HTML
<h1>{{ section.settings.title }}</h1>  //여기를 이렇게 간단하게 변경
<p>{{ 'general.404.subtext_html' | t }}</p>

//schema
{% schema %}
  {
    "name": "Template-404",
    "settings": [
      {
        "type": "text",
        "id": "title",
        "default": "404", // Underneath of ID
        "label": "404 Heading Title"

      }
    ]
  }
{% endschema %}

나머지도 바꿔주기

<h1>{{ section.settings.title }}</h1>
<p>{{ section.settings.subtext_title }}</p>

{% schema %}
  {
    "name": "Template-404",
    "settings": [
      {
        "type": "text",
        "id": "title",
        "default": "404", //여기가 화면에 나오는 내용
        "label": "404 Heading Title"

      }, {
        "type": "text",
        "id": "subtext_title",
        "default": "The page you were looking for does not exist", //여기가 화면에 나오는 내용
        "label": "404 Subtext Title"
      }
    ]
  }
{% endschema %}

 

결과

 

 

쇼피파이 관리자 페이지

새로고침 하니 이렇게 setting 이 적용되었다 !!

 

여기서 이제 커스터마이징 할 수 있다! 

 

아..아직도 어렵다 ㅠㅠ

좀 감이오는것같은데~~

728x90