How to Create & Edit Modals

This doc reviews the basic steps of building a modal. For more advanced use:

Creating Modals

  1. Open the Appcues editor; click Create and select Modal
  2. The first step of your flow will automatically appear - click the + icon to start adding media: you can add text, images, videos, forms, and a hero (an heading image without padding)
    1. To add custom HTML or to embed iframed content, select Add text and open the HTML editor brackets <> icon to insert the snippet

  3. To add another step in your flow, click Add > Modal from the editor bar

Editing Modals

Step-level

You can make changes to individual steps within a flow that will not affect other steps.

Changing button text

To change the text of the buttons in your modals (that your end-users will see), simply click on the button and start editing the text

Deleting & Reordering Steps

To edit individual steps within your modal flow, you'll have to click on the specific step.

To reorder your steps drag and drop the step into place.

To delete a step: While on the step you'd like to delete, click the cog icon to expand the settings menu. From there, click the trash icon and then red delete button for confirmation.

Skippable

Flows can be skippable or required for you end users. Skippable modals include a X button in the top-right corner of the modal to let your users opt out. If you uncheck the Skippable box, the X button will be removed and users will have to click through your entire flow before it closes.

Theme

You can apply any of the themes you create at your Styles page to your flow. Select a theme from the Theme dropdown and it will automatically apply its styling to every step in your flow.

Learn more about creating themes  here.