Available widgets

The table below presents an overview of all the widgets available in the Contentful entry editor.

NameDescriptionField type

How widgets work

Single line

This widget is a text input field that displays as a single line. The widget supports only plain text and removes any formatting options and line breaks from the input.

This widget is a default option for the Short text field.

Multi-line text

Text input field displayed as a text area. The widget supports only plain text and removes any formatting options from the input.

Markdown editor

Text input widget that supports basic text formatting using markdown syntax. Markdown allows users to write using an easy-to-read, easy-to-write plain text format, which is later converted to a structurally valid HTML. The widget comes with a preview option (toggle in the top right corner) and a toolbar for most popular formatting options, including:

Block elementsSpan elements

This widget is a default option for the Long text field.

Radio button

This widget allows users to select a single value from a predefined list of options displayed as inline radio buttons. Note that available options have to be configured using the predefined values rule in the validation tab. At the moment, the maximum number of options is capped at 50. The widget can be used in a combination with both text and number fields.

This widget allows users to select a single value from a predefined list of options displayed as an expandable menu. Note that available options have to be configured using the predefined values rule  in the validation tab. At the moment, the maximum number of options is capped at 50. Note that the widget can be used in a combination with both — text and number fields.

Number editor

This widget is a number input field that accepts only numerical values. When non-numerical values are entered, users are alerted to the fact, and non-numerical values are ignored. Similarly, when a decimal number is entered into the integer field, the decimal part of the input is skipped. Please note that the number editor expects a period to be used as a decimal mark.

This widget is a default option for the Number field.

Rating scale

The widget allows numerical values to be entered via an interactive rating scale. The scale can be configured to be anywhere between 1 and 20 points. Currently, the widget displays rating shapes as circles only. User input is stored internally as an integer.

Date picker

This widget is a date input field that prompts users to select a value from a calendar overlay. The widget can be configured to expect a date only, date and time without a timezone, and date and time with a timezone. Time input, similarly, can be displayed in 24-hour or AM/PM notation.

Contentful stores date values as ISO 8601-encoded strings following the standard notation “2013-05-02T13:00:00Z.” The time arguments (hours, minutes, seconds) are optional and taken to be zero when not given. Similarly, when the time zone argument is missing, it is set to “Z,” which corresponds to the zero UTC offset.

Location

This widget is a geo-location input field that gives users three options to enter data: drop a pin on an interactive map, search for an address or directly enter geographical coordinates using a decimal degrees notation (e.g. “Latitude: 40.738413 | Longitude: -73.976784”). Regardless of the input method, Contentful stores location as geo-coordinates expressed in latitude and longitude.

This widget is a reference field that displays a linked entry as a block element with a title and a status indicator. Entries can be rearranged in a list by dragging and dropping them. When the  entry title is missing, or a content type does not have a title field, the linked entry will be displayed as “Untitled.”

This widget is a default option for the Reference field.

Reference (card view)

This widget is a reference field that displays a linked entry as an inline card with a title, status indicator, thumbnail, and teaser info. Thumbnail and teaser are optional and will only appear if the linked entry contains the relevant information. Entries can be rearranged in a grid by dragging and dropping them. When an entry title is missing, or a content type does not have a title field, the linked entry will be displayed as “Untitled.”

Object field

JSON input field that only accepts a valid JSON. Any changes to the existing code have to be saved manually by clicking on a submit button or reverting to an earlier version of the code. Note that invalid JSON inputs will not be stored in Contentful.

Media asset preview

This widget is a media asset field that displays a linked asset as a block element. Additional controls allow users to view asset metadata (filename and type, its size and dimensions) and edit image assets in the built-in image editor.

This widget is a default option for the Media asset field.

This widget is a media asset field that displays a linked asset as a 120x120 px thumbnail, with multiple assets arranged in a grid. For non-image assets, the widget displays a default icon and an asset title.

Slug generator

The slug widget generates a web-friendly slug based on the value of the title field and verifies its uniqueness by looking at the published entries of the same content type. When the title is missing, the widget automatically generates a placeholder slug based on the current date and time.

Default length of the slug is 75 characters or less, but it can be manually extended to 250 characters. Note that the slug widget only works when a content type has a designated title field. While the widget stops tracking changes in the title field once an entry is published, users can update the generated slug manually at any time.

Embedded content

Embedded content widget parses a provided URL and automatically embeds found media objects as block elements within the entry editor. Note that Contentful stores only the entered URL.

Supported formats include videos, images, presentations, streaming services, status updates and other rich media from more than 300 providers. The full list of providers can be found on the partner page.

Was this helpful?
add-circle arrow-right remove style-two-pin-marker subtract-circle remove