Toggle Field

The Switch field is a Collection field that is primarily used as a filtering tool. A switch is a field type which can have either of two values: Yes or No.

The Toggle field is a Collection field that is primarily utilized as a filtering tool. A toggle is a field type which can have either of two values: Yes or No. Collaborators can switch a toggle on or off to specify, for instance, if a blog post “is featured.” The toggle field can be utilized to filter Collection lists. You can even arrange a list using toggles. And one of the optimal methods to utilize a toggle field is by establishing conditional visibility on elements in Collection lists and Collection pages.

Frequent Applications
  • Desire to showcase only non-profits? Create a “Non-profit?” toggle.
  • Desire to exhibit featured articles? Create a “Featured?” toggle.
  • Desire to conceal specific items until they are prepared to be exhibited on your site? Build a “Hidden?” toggle.
  • Desire to display an “On Sale” label only for chosen items? Build an “Is On Sale?” toggle.
Throughout this tutorial
  1. Development of a toggle field
  2. Defining a toggle value
  3. Filtering a Collection list using the toggle field
  4. Organizing a Collection list using the toggle field
  5. Establishing conditional visibility using the toggle field

Development of a toggle field

A toggle field can be appended to a new or existing Collection. Within Collection settings, tap on New Field and then select the Toggle field.

Insider Tip
The prevailing value for a toggle is “No”. Thus, when you establish a toggle, ponder labeling it with a query that will likely have “No” as the answer most times. As such, you’ll initiate the switch solely for the select “Yes” answers. For instance, if you aspire to mask only a few out of a hundred blog posts, produce a toggle termed “concealed” rather than “displayed”.

Defining a toggle value

Whether you’re establishing a new item in the CMS from the Designer or the Editor, you can set a toggle on or off by straightforwardly toggling it to Yes or No.

 

Filtering a Collection list using the toggle field

If you wish to generate a Collection list that exclusively reveals items with a specific toggle set to Yes, such as a Collection list of featured posts, you can establish a filter that accomplishes that:

  1. Select the Collection list you intend to filter
  2. Proceed to the Settings panel (D)
  3. Incorporate a Filter beneath Collection List Settings
  4. Select your toggle field in the first dropdown
  5. Opt for Is On in the second dropdown
  6. Hit Save
 

The filter regulations that can be employed with the link field and values are:

  • Is On – inspects for CMS items that have toggled the switch On for this toggle field
  • Is Off – scrutinizes for CMS items that have kept the switch Off for this toggle field

Find out more about filtering collection lists.

Organizing a Collection list using the toggle field

Occasionally, you do not desire to exclude Collection items in a Collection list, but you would rather exhibit specific items first, trailed by less critical items. Hence, in place of applying a filter, you can define a sort order utilizing a toggle field:

  1. Select the Collection list you aspire to filter
  2. Head to the Settings panel (D)
  3. Add a Sort order under Collection List Settings
  4. Select your toggle field in the first dropdown
  5. Choose the sort order in the second dropdown: Is Off First or Is On First
  6. Hit Save

Establishing conditional visibility using the toggle field

To maximize Toggles, you can utilize the conditional visibility feature to realize various designs. Here are several instances:

Displaying unique labels

If you own labels such as “Featured”, “On-sale”, “Out of stock”, etc., you can employ conditional visibility to exhibit them solely on items with a specific toggle set to Yes.

  1. Select the label
  2. Proceed to the Settings panel (D)
  3. Incorporate a Condition (when this element is visible) beneath Conditional visibility
  4. Select your toggle field in the first dropdown
  5. Opt for Is On in the second dropdown
  6. Hit Save

Displaying a complete section

You can establish distinct Collection pages, each capable of having entirely distinct layouts based on the conditions set on sections of a Collection page.

For instance, you can create a contact form section on the Collection page. Then, establish a toggle named “Show contact form” in your Collection. Presently, if you set a conditional visibility rule on this section, the contact form will only be visible on Collection pages for Collection items with the contact form toggle set to Yes.

To institute a condition as such:

  1. Select the entire section you want to depict/conceal
  2. Head to the Settings panel (D)
  3. Incorporate a Condition (when this element is visible) under Conditional visibility
  4. Select your toggle field in the first dropdown
  5. Opt for Is On (or is Off) in the second dropdown
  6. Hit Save
 

Find out more about conditional visibility.

Ewan Mak
Latest posts by Ewan Mak (see all)