Content schema

Reference tables

Within the schema tags, content sections can define all the properties of existing sections. Content sections only support blocks when content is set to false. A name property must be defined in the section schema.

Content sections define content settings using content. Content settings cannot appear in settings or blocks.

The content section schema field

{% schema %}
  {
    "name": <SectionName>,
    "content": <ContentSchema> | [<ContentSchema>] | false,
    "settings": [<PresentationSettingSchema>]
  }
{% endschema %}

<ContentSchema>

{
  "type": <ContentType>,
  "settings": [<PresentationSettingSchema>],
  "name": <String>,
  "config":
    "<ContentSettingId>": {
      "label": <String>,
      "info": <String>
    }
  }
}

<ContentType>

This is not a final list of all the content types, and will be updated as they are released.

Content type Setting Schema
text {
title: text
body: richtext
}
image {
image: image_picker,
link: url,
caption: richtext
}
external_video {
url: video_url
cover: image
caption: richtext
}
product { product }
collection { collection }
article { article }
blog { blog }
menu { menu }

<ContentSettingId>

The identifier of one of the built-in settings of a content type in the Content Schema.

List of settings types

Content setting types
textarea
richtext
image_picker
collection
product
blog
article
page
link_list
video_url
html
Presentation setting types
text
checkbox
radio
select
range
color
font_picker
number
Non-interactive setting types
header
paragraph

Examples

Section that accepts one product content, with an additional presentation section setting on the section.

{% schema %}
  {
    "name": "Featured product",
    "content": {
      "type": "product",
      "config": {
        "product": {
          "label": "Featured product"
        }
      }
    },
    "settings": [
      { "type": "checkbox", "id": "show_vendor" }
    ]
  }
{% endschema %}

{{ section.content.product }}
{{ section.settings.show_vendor }}

Section that accepts multiple image contents, with an additional presentation setting on the content.

{% schema %}
{
  "name": "Slideshow",
  "content": [
    {
      "type": "image",
      "name": "Image slide",
      "settings": [
        {
          "type": "select",
          "id": "alignment",
          "label": "Image alignment"
        }
      ]
    }
  ],
  "settings": [
    {
      "type": "checkbox",
      "id": "autorotate",
      "label": "Auto-rotate slides"
    }
  ]  
}
{% endschema %}

The richtext setting type

The richtext setting is a content setting type used to add a rich text editor to a section. The richtext setting type has been updated to support additional elements.

The following elements are supported by the updated rich text editor:

  • Headings
  • Button-style links
  • Alignment
  • Indentation
  • Blockquote format
  • Unordered and ordered lists
  • Tables
  • Code/ HTML block

Ready to start selling with Shopify?

Try it free