Skip to main content

Creating and Reusing Components in the Alia Editor

Save time by turning any element into a reusable component you can use across popups.

Written by Gary Thomas

Components is a new feature in the Alia editor that lets you save any element as a reusable building block. Once an element is converted into a component, you can add it to any step within the same popup or across other popups, without having to rebuild it from scratch each time.
​

This is particularly useful for elements you use repeatedly, such as discount code blocks, trust badges, branded headers, or CTA buttons. Update the component once, and it stays consistent everywhere it's used.

Step 1: Convert an Element into a Component

You can turn any existing element in your popup into a component directly from the editor.

  • Open the popup you want to edit in the Alia editor.

  • In the element panel on the left, right-click on the element you want to convert.

  • From the context menu, select Convert to component.

Step 2: Reuse the Component in Any Popup

Once an element has been converted to a component, it becomes available in the element picker and can be added to any step in any popup.

  • Click the + icon to add a new element in any step.

  • In the Add element panel, search for the name of your component.

  • Your saved components will appear under the Components section in the search results.

  • Click on it to add it to your current step.

Components make it easy to keep your popups consistent and save time when building or updating multiple campaigns. Any element you find yourself recreating regularly is a great candidate to convert into a component.


Best Practices:

  • Give your components clear, descriptive names (e.g. "Discount Code Block" or "Email CTA Button") so they're easy to find in the element picker.

  • Use components for brand-consistent elements like logos, trust badges, or branded footers that should look the same across all popups.

  • Before converting an element, make sure it's fully styled and configured β€” changes you make to a component will reflect wherever it's used.

Did this answer your question?