The Drop-down component

This component is not supported for Google Ads, Google AdMob, AMPHTML ads, video ads or image ads.

The Drop-down component lets you add a drop-down to your project. You specify the options listed in the drop-down.

To use the Drop-down component in your project:

1. Open the Components panel, then the UI folder.
2. Drag the Drop-down  component to the stage.
3. In the Drop-down properties section of the Properties panel, click the Options field to configure the drop-down options.
   1. For each option that you want to add:
      1. Click Add option.
      2. Enter a label (the text visible to the user).
      3. Enter a value (the value of the drop-down if the user selects this option).
   2. Choose which option is the default. The default option is selected in the drop-down when the page initially loads.
   3. Click OK.
      
4. You may want to use the Label component to display text before the drop-down.

Properties

Property	Description
Name	The component name.
Options	The list of options available in the drop-down. Click this field to configure the list.

Events and actions

Events sent by the Drop-down component

You can trigger other actions based on the following Drop-down component event:

Event	Description
Change	Sent when the selected option changes.

To select this event in the Event dialogue, set the Drop-down component as the target.

Learn how to configure events.

Preview

You can't interact with UI components inside the Google Web Designer interface. To see the component in action, preview your document in your preferred browser. The appearance of UI components may vary depending on the browser.