* Initial commit for the new widgets section * Placing all the widgets and refining the CSS and Hugo logic * Initial commit for the new widgets section * Placing all the widgets and refining the CSS and Hugo logic * Rebased and updated the info according to @verythorough contribution * Fixing the yaml codes for the relation and select widget sections * Merging with widgets.md and app.j * Fixing some silly mistakes (sorry!) * Following @verythorough contributions :) * Adding the markdown widget and fixing the widgets container background * Adding the URL functionality and myself as a contributor :) * Adding myself as a contributor :)
1.6 KiB
title | position |
---|---|
Widgets | 30 |
Widgets
Widgets define the data type and interface for entry fields. Netlify CMS comes with several built-in widgets. Click the widget names in the sidebar to jump to specific widget details. We’re always adding new widgets, and you can also create your own!
Widgets are specified as collection fields in the config.yml
file. Note that YAML syntax allows lists and objects to be written in block or inline style, and the code samples below include a mix of both.
To see working examples of all of the built-in widgets, try making a 'Kitchen Sink' collection item on the CMS demo site. (No login required: click the login button and the CMS will open.) You can refer to the demo configuration code to see how each field was configured.
Common widget options
The following options are available on all fields:
required
: specify asfalse
to make a field optional; defaults totrue
pattern
: add field validation by specifying a list with a regex pattern and an error message; more extensive validation can be achieved with custom widgets-
Example:
- label: "Title" name: "title" widget: "string" pattern: ['.{10,}', "Must have at least 20 characters"]
-