Field Properties

Attributes for fields belonging to a model in Stackbit configuration.

Fields are how you can specify or override the appearance of a field in the Stackbit editor, along with other behavior attributes.

Usage

All fields declared by a model are listed as objects under in the fields property (as an array of objects).

In this example, we're showing a simple Page model with a single title field.

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
export default {
  models: {
    Page: {
      fields: [
        { name: 'title', type: 'string', required: true },
        // other field definitions ...
      ],
      // other model properties ...
    },
  },
  // other properties ...
}

Extending Fields

Note that when models are extended from other models, you are only required to set the field properties that you'd like to override. A property listed as required below will not be needed if it was set on an extended field.

Field Attributes

const

Allows a constant value to be set for a field. The UI will display that value as read-only and will not let the user change it.

Required
No
Allowed Values
A constant value that should be used when the creating a new content piece.
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
export default {
  models: {
    Page: {
      fields: [{ name: 'layout', type: 'string', const: 'Page' }],
    },
  },
}
  • Do not define default if using this field. It will have no effect.
  • If you don't want the field to be visible in the UI, also set hidden: true for that field.

default

Stackbit sets this value to the field when adding a new page or adding a component to a page.

Required
No
Allowed Values
The initial value for this field when creating new content.
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
export default {
  models: {
    Page: {
      fields: [{ name: 'title', type: 'string', default: 'My New Page' }],
    },
  },
}
  • This is not a fallback value. if a field's value is empty when publishing the content, its value is not set back to default.

description

Descriptive or help text, presented as a tooltip when hovering over the info icon.

Required
No
Allowed Values
A string with the appropriate text.
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
export default {
  models: {
    Page: {
      fields: [
        {
          name: 'heading',
          type: 'string',
          description: 'Help or descriptive text for this field ...',
        },
      ],
    },
  },
}
Field Description Tooltip
Field Description Tooltip

hidden

If you're setting a fixed constant value for a field (see the const property) and you don't want that field to be at all visible to content creators in the visual editor, you can hide it with this property.

Required
No
Allowed Values
true, false
Default
false
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
export default {
  models: {
    Page: {
      fields: [{ name: 'layout', type: 'string', const: 'Page', hidden: true }],
    },
  },
}

label

This property denotes an optional human-friendly name that will be used in the UI. It can be changed without affecting stored data or other models.

Required
No
Allowed Values
String
Default
A human-friendly string, inferred from the name attribute.
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
export default {
  models: {
    Page: {
      fields: [{ name: 'title', type: 'string', label: 'Heading' }],
    },
  },
}

name

The name of the field is the key used to store it in the content source.

Required
Yes
Allowed Values

String following these rules:

  • Contain only alphanumeric characters, underscores or hyphens.
  • Start with a letter.
  • Cannot end with an underscore or a hyphen.
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
export default {
  models: {
    Page: {
      fields: [{ name: 'title', type: 'string' }],
    },
  },
}

required

If a field is required and left empty in a piece of content, publishing will result in an error message to the content editor.

Required
No
Allowed Values
true, false
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
export default {
  models: {
    Page: {
      fields: [{ name: 'title', type: 'string', required: true }],
    },
  },
}

type

Specifies the type of field, which affects other available attributes and default values. Each type has its own documentation page, which is listed below.

Required
Yes
Allowed Values

A valid field type as a string. Choosing a field type can lead to additional required fields and variations on default values, which are documented in individual pages, linked below.

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
export default {
  models: {
    Page: {
      fields: [{ name: 'title', type: 'string' }],
    },
  },
}