Boolean

The boolean field allows content writers to select a true or false value. The field is displayed as a toggle in the Page Builder.

Boolean field values can be used like a boolean in JavaScript for conditional rendering.

{
  slice.primary.is_beta ? <span>Beta</span> : <span>Production</span>;
}

Add a boolean to a content model

• Open Slice Machine

  In your Prismic project, start Slice Machine to begin editing content models.

  npx start-slicemachine --open

• Add a boolean field

  In Slice Machine, navigate to the slice, page type, or custom type you want to modify. Add a boolean field.

  The label determines the label shown to content writers in the Page Builder. Use an easily understood name.

  The API ID determines the property name in the Content API. Use a short, snake-cased name.

• (Optional) Set a default value

  By default, a boolean is set to false. It can default to true by checking the Default to true checkbox in the boolean’s settings.

• (Optional) Set custom labels

  A boolean can display custom labels for true and false. For example, you could set true to “Yes” and false to “No.”

  Open the field settings and set custom labels in the True Placeholder and False Placeholder fields.

Use booleans

Booleans can be used like a boolean in JavaScript.

In this example, “Beta” is displayed when the is_beta boolean is true and “Production” when it is false.

{slice.primary.is_beta ? (
  <span>Beta</span>
) : (
  <span>Production</span>
)}

API response

Here is what a boolean looks like from the Content API:

{
  "example_boolean": true
}