This component is not supported for Google Ads, Google AdMob, AMPHTML ads, video ads, or image ads.
The Dropdown component lets you add a dropdown to your project. You specify the options listed in the dropdown.
To use the Dropdown component in your project:
- Open the Components panel, then the UI folder.
- Drag the Dropdown
component to the stage.
- In the Dropdown properties section of the Properties panel, click the Options field to configure the dropdown options.
- For each option you want to add:
- Click
Add Option.
- Enter a label (the text visible to the user).
- Enter a value (the value of the dropdown if the user selects this option).
- Click
- Choose which option is the default. The default option is selected in the dropdown when the page initially loads.
- Click OK.
- For each option you want to add:
- You may want to use the Label component to display text before the dropdown.
Add Option.
Properties
| Property | Description |
|---|---|
| Name | The component name. |
| Options | The list of options available in the dropdown. Click this field to configure the list. |
Events and actions
Events sent by the Dropdown componentYou can trigger other actions based on the following Dropdown component event:
| Event | Description |
|---|---|
| Change | Sent when the selected option changes. |
To select this event in the Event dialog, set the Dropdown 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.
