Radical Design Course by Jack McDade

From the creator of Statamic

Learn how to make your websites standout and be remembered.

Taking your approach on designing things actually makes it fun, more natural, and overall easier.

— Dominik, Developer

Radio Fieldtype

Radio buttons. The "you can only have one" variation of checkboxes. Create some options and let your users select one and only one. May they choose wisely.

Radio Fieldtype UI
The Radio Fieldtype in action!

Overview

The radio fieldtype is a multiple choice input where you only get one choice. It saves the chosen option from a preset list.

Configuring

Use the options setting to define a list of values and labels.

favorite:
type: radio
instructions: Choose your favorite food.
options:
donuts: Donuts
icecream: Ice Cream
brownies: Brownies

You may omit the labels and just specify keys. If you use this syntax, the value and label will be identical.

options:
- Donuts
- Ice Cream
- Brownies

Data Structure

The chosen option is stored as a string. If you only specified values for the options array, then the label will be saved.

favorite: brownies

Templating

It's a string, so you can just use that value.

<p>I love {{ favorite }}. A lot.</p>
<p>I love {{ $favorite }}. A lot.</p>
<p>I love donuts. A lot.</p>

Options

inline

bool

Show the radio buttons next to each other in a row instead of stacked vertically. Default: false

options

array

Sets of key/value pairs define the values and labels of the radio options.

Docs feedback

Submit improvements, related content, or suggestions through Github.

Betterify this page →