Widget Field Types (type)

Every widget and block in Qumra uses a schema.json file to define its settings. Each setting field requires a type property that determines the kind of input shown to the merchant in the page builder.

Key Concept

You can name your setting keys whatever you want. The important thing is to set the correct type property. The key name becomes available in your template as widget.settings.YOUR_KEY.

Basic Input

Simple data entry fields

string

Short text input

schema.json

{
  "title": {
    "type": "string",
    "label": "Title",
    "default": ""
  }
}

text

Long text (textarea)

schema.json

{
  "body": {
    "type": "text",
    "label": "Description",
    "default": ""
  }
}

number

Numeric value

schema.json

{
  "amount": {
    "type": "number",
    "label": "Amount",
    "default": 0
  }
}

font_picker

Font family selector

schema.json

{
  "headingFont": {
    "type": "font_picker",
    "label": "Heading Font",
    "default": "Cairo"
  }
}

Selection

Dropdown and toggle fields

boolean

On/Off toggle switch

schema.json

{
  "show": {
    "type": "boolean",
    "label": "Show section",
    "default": true
  }
}

select

Dropdown select list

schema.json

{
  "layout": {
    "type": "select",
    "label": "Layout",
    "options": [...]
  }
}

radio

Radio button group

schema.json

{
  "alignment": {
    "type": "radio",
    "label": "Alignment",
    "options": [...]
  }
}

Store Content

Products, collections, and media

product

Single product or list of products

schema.json

{
  "featured": {
    "type": "product",
    "label": "Featured",
    "default": ""
  }
}

collection

Single or multiple collections

schema.json

{
  "primary": {
    "type": "collection",
    "label": "Collection",
    "default": ""
  }
}

collection_products

Collection with its products

schema.json

{
  "feat": {
    "type": "collection_products",
    "label": "Featured",
    "default": ""
  }
}

media

Image or video upload

schema.json

{
  "hero": {
    "type": "media",
    "label": "Hero Image",
    "default": ""
  }
}

menu

Menu from store settings

schema.json

{
  "nav": {
    "type": "menu",
    "label": "Navigation",
    "default": "header"
  }
}

page

Store page picker

schema.json

{
  "selectedPage": {
    "type": "page",
    "label": "Page",
    "default": ""
  }
}

article

Single article or list of articles

schema.json

{
  "featured": {
    "type": "article",
    "label": "Featured",
    "default": ""
  }
}

blog

Single or multiple blogs

schema.json

{
  "primary": {
    "type": "blog",
    "label": "Blog",
    "default": ""
  }
}

blog_articles

Blog with its articles

schema.json

{
  "feat": {
    "type": "blog_articles",
    "label": "Featured Blog",
    "default": ""
  }
}

Layout

Spacing and repeating blocks

spacing

Padding & margin control

schema.json

{
  "padding": {
    "type": "spacing",
    "label": "Padding",
    "default": {}
  }
}

blocks

Repeating content blocks

schema.json

{
  "blocks": {
    "slide": {
      "name": "Slide",
      "settings": { ... }
    }
  }
}