Shopify input settings are the configurable options you define in your theme's schema to let merchants customize their store through the theme editor. Each input type collects a different kind of value — from simple text to color selections to resource pickers. This guide covers all the core input setting types and how to use them effectively.

Where Input Settings Are Used

Input settings appear in two places in a Shopify theme:

Theme settings (settings_schema.json): Global settings accessible across the entire theme via the settings Liquid object
Section and block settings (inside {% schema %} tags): Settings scoped to individual sections or block instances, accessed via section.settings or block.settings

The same input types work in both contexts. The difference is only in scope.

Basic Input Types

checkbox

Returns a boolean true or false. Use it for on/off toggles, like enabling a feature or showing/hiding an element.

{
  "type": "checkbox",
  "id": "show_announcement",
  "label": "Show announcement bar",
  "default": true
}

number

Accepts a numeric value. Useful for settings like items per row, column counts, or duration values. Returns a number in Liquid, so it can be used in arithmetic operations.

{
  "type": "number",
  "id": "products_per_row",
  "label": "Products per row",
  "default": 4
}

radio

Presents a set of options where only one can be selected. Requires an options array. Good for mutually exclusive layout or style choices where all options are worth showing at once.

{
  "type": "radio",
  "id": "image_style",
  "label": "Image style",
  "options": [
    { "value": "square", "label": "Square" },
    { "value": "rounded", "label": "Rounded" },
    { "value": "circle", "label": "Circle" }
  ],
  "default": "square"
}

range

A slider that lets merchants select a value within a defined range. Requires min, max, and step properties. Useful for font sizes, spacing, or opacity values where a visual slider is more intuitive than a text input.

{
  "type": "range",
  "id": "font_size",
  "label": "Font size",
  "min": 12,
  "max": 24,
  "step": 1,
  "unit": "px",
  "default": 16
}

select

A dropdown that lets merchants choose from a predefined list of options. Works like radio but renders as a dropdown, which is preferable when you have more than 3–4 options or want to save vertical space in the editor.

{
  "type": "select",
  "id": "layout",
  "label": "Layout",
  "options": [
    { "value": "grid", "label": "Grid" },
    { "value": "list", "label": "List" },
    { "value": "masonry", "label": "Masonry" }
  ],
  "default": "grid"
}

text

A single-line text input. Use it for short strings like button labels, section headings, or custom class names. Returns a string in Liquid.

{
  "type": "text",
  "id": "button_label",
  "label": "Button label",
  "default": "Shop now"
}

textarea

A multi-line text input. Use it when merchants need to enter longer content like descriptions, custom messages, or paragraph text. Unlike richtext, textarea returns plain text without HTML formatting.

{
  "type": "textarea",
  "id": "custom_message",
  "label": "Custom message",
  "default": "Enter your message here"
}

Specialized Input Types

Beyond basic inputs, Shopify provides specialized types that let merchants select theme assets, store resources, or apply visual settings:

color: Opens a color picker, returns a hex value
image_picker: Lets merchants upload or select an image; returns an image object
collection: Returns a collection object (useful for featured collection sections)
product: Returns a product object
blog, page, link_list: Return the corresponding Shopify objects
font_picker: Returns a font object from Shopify's font library
video_url: Accepts a YouTube or Vimeo URL and returns a URL object
richtext: A basic rich text editor that returns HTML
html: Accepts raw HTML input

Specialized types that return Shopify objects (collections, products, etc.) return nil if the merchant hasn't selected anything, so always check for nil before rendering in Liquid.

Custom Fields on Product Pages

A common use of input settings is adding custom fields to product pages — for example, a text field for gift message engraving, a checkbox for gift wrapping, or a dropdown for personalization options. These are typically implemented by adding input fields directly to the product form using Liquid, rather than through the settings schema. The fields are submitted as line item properties when added to cart.

For a basic text field on a product form:

<label for="gift-message">Gift message (optional)</label>
<input type="text" id="gift-message" name="properties[Gift message]">

The name="properties[Key]" format tells Shopify to store the value as a line item property. These properties appear in the order confirmation and admin order view.

Using Input Settings Effectively

A few principles for good settings design: use select or radio over text whenever there's a fixed set of valid values — free text inputs are hard to validate and easy for merchants to break. Use helpText fields to explain settings that aren't self-explanatory. Group related settings together using header and paragraph info blocks (these are non-input settings that organize the editor UI).

For the full settings reference including all supported types and their properties, see Shopify's input settings documentation.