Dropdown

Create dropdown layouts

This article walks you through using the dropdown layout content item and adding it to your site. The dropdown content item is useful for when you want a list of manually set options to show on a dropdown. Clicking on an option in the dropdown will apply the relevant action and close the dropdown. 

Dropdown Style

The dropdown layout content item references the dropdown design token for styling, so in order to design settings for the dropdown, along with the relevant states, you should configure your dropdown design token first. 

Once you have configured the styling you want, you can select the relevant design token from the Style field in the Style fieldset. 

Fields

The dropdown content item contains fields for you to configure the specific options within that usage of the dropdown. 

• Label: Add a label to the dropdown. 
• Style: Choose the dropdown design token style you want to apply to this dropdown and the dropdown width. 
• Options: Set the list of options available in the dropdown, each with the following settings: 
  • Label: the label of the option.
  • Value: the value that will show on the dropdown.
  • Action: the link or link action that will be activated on selecting that dropdown option.
  • Default: set the dropdown option to show by default on the dropdown.