If you are moving from the legacy Drag and Drop Editor to the new Drag and Drop Editor, most tasks still work the same way, but some buttons, panels, and blocks have new names or new locations. This guide maps the tasks you know from the legacy editor to their equivalents in the new editor.
Saved modules are transferred to the new editor automatically. If you switch back to the legacy editor, these modules are not visible there.
This guide explains the following concepts:
Quick reference: legacy vs. new editor
I want to… | Legacy editor | New editor |
|---|---|---|
Insert dynamic content into text | Dynamic Content button in the panel above the template | Add Dynamic Content in the Text block's inline toolbar |
Write Liquid in the email body | Not available | Turn on Liquid Tags in the Design step, then type Liquid in any Text block |
Set fonts, colors, and width for the whole email | Appearance > General Settings | Appearance > General settings |
Keep a saved module's own look | No option | Turn on Keep module styles when you save or update the module |
Show abandoned cart products | Cart item product blocks | Items block, Item Type Cart |
Show browsed products | Browsed item product blocks | Items block, Item Type Browsed |
Show purchased products | Purchased item product blocks | Items block, Item Type Purchased |
Add a display condition | Conditions tab of a stripe, structure, or container | |
Find saved modules | Modules > Custom Modules | Modules tab |
Restore an earlier design | Version history | Version History button next to the Autosave toggle |
Add dynamic content
The dynamic content syntax is the same in both editors: {{attribute}} inserts a value, and {{attribute|fallback}} adds a fallback. What changes is where you open the dynamic content picker.
Task | Legacy editor | New editor |
|---|---|---|
Insert an attribute into text | Place the cursor in the text and click the Dynamic Content button in the settings panel above the template. | Select a Text block, click inside it to open the inline editor, and click the Add Dynamic Content button in the text toolbar. |
Add a fallback | Type it inside the tag, e.g., {{name|customer}}. | Enter it in the fallback pop-up that opens after you pick the attribute, or type it inside the tag. |
Format a date or number | {{attribute|time-format=DD-MM-YYYY}} or {{attribute|number-format=dot,comma}} | Same syntax while Liquid Tags are off. With Liquid Tags on, use Liquid filters such as time_format and money_format. |
Add a dynamic URL | Type the fixed part of the URL, then add the attribute with Dynamic Content. | Type the URL with the attribute tag in the link field of the text, button, or image, e.g., https://yourcompany.com/{{name}}. |
Add a dynamic image | Insert the image attribute, then copy its syntax into the image path of an Image block. | Same: insert the image attribute into a Text block, copy the tag, and paste it into the Image block's image path. |
Add campaign attributes | {@email_campaign_name}, {@email_campaign_id}, {@email_variation_id} | Same syntax. |
To add dynamic content in the new editor:
Drop a Text block into your email, or select an existing one.
Click inside the block to open the inline editor.
Place the cursor where the value should appear and click the Add Dynamic Content button.
Select a default or custom attribute. In Architect emails, you can also select event parameters, coupons, recommendations, and cart, browsed, purchased, or wishlist items.
Optionally, enter a fallback value and save.
Dynamic images and dynamic URLs do not resolve in the editor. Send a test email to check them before you launch.
For the full syntax reference, including all date and number formats, see Personalize emails with dynamic content.
Use Liquid
Liquid in the email body works only in the new editor. In the legacy editor, the body supports the standard {{attribute|fallback}} syntax only.
Legacy editor | New editor | |
|---|---|---|
Liquid in subject and preheader | Available when Liquid Tags are on | Available when Liquid Tags are on |
Liquid in the email body | Not available | Available in every Text block |
Liquid in the HTML editor | Available | Available |
How you know it is on | — | Liquid Tags Enabled badge in the editor's top toolbar |
To use Liquid in the new editor:
In your email campaign, go to the Design step.
On the Message Content screen, turn on the Liquid Tags toggle in the top-right corner.
Click the Enable and Delete button to confirm.
Open the Drag and Drop Editor and check that the Liquid Tags Enabled badge appears in the top toolbar.
Select a Text block and type your Liquid code directly into it.
Click the Preview and Test Message button to render the email with a real user's data and send a test.
Turning on Liquid Tags permanently deletes the existing Subject, Preheader, and Message Design content of the campaign, for all variants. Copy your subject line and preheader before you switch.
To create a reusable Liquid template, select Enable Liquid Tags in the Create Template drawer of the Email Template Library. You cannot convert a Liquid template back to the standard syntax; duplicate the original template instead.
Liquid Tags are available for early access. Contact the Insider One team to activate them for your account.
For syntax, filters, and examples, see Liquid in Email.
Keep module styles and Appearance settings
In the new editor, a saved module follows the Appearance settings of the email you add it to, unless you turn on Keep module styles. This is why a module transferred from the legacy editor can look different, e.g., with other button sizes or colors.
Appearance settings
Legacy editor | New editor | |
|---|---|---|
Where to find it | Appearance tab > General Settings | Appearance tab > General settings |
What it controls | Fonts, colors, buttons, padding, email and content background, email width | General background color and image, message content width (320–900 px, 600 px by default) and alignment, underline links, responsive design, right-to-left text, custom list styles, default structure padding |
Which wins | A style set on a row, container, or block overrides the general setting. | Same. |
Save a module
Legacy editor | New editor | |
|---|---|---|
Save | Click the Save as module button. | Hover over a stripe, structure, or container and click the Save as module icon. |
Details | Name, description, category, tags, image path | Name, description, category, tags, Keep Module Styles, Synchronized |
Find saved modules | Modules > Custom Modules | Modules tab, with search, category filter, and grid or list view |
Styles | No style option when saving. | Depends on Keep module styles (see below). |
Keep module styles works as follows:
Off: The module adapts to the Appearance settings of each email, such as fonts, text colors, and button styles. Use this for modules that should match each campaign's branding.
On: The module keeps the look it had when you saved it. Use this for modules that must look the same everywhere, such as a legal footer or a brand header.
To make a transferred module look as it did in the legacy editor:
Add the module to an email in the new editor.
Adjust its styles until it looks the way you want.
Select the module, turn on Keep module styles in the Settings panel, and click the Update button.
From then on, the module keeps this look in every email you add it to.
Show cart, browsed, and purchased products with the Items block
In the new editor, one Items block replaces the separate cart, browsed, and purchased product blocks of the legacy editor. You pick the item type and the item slot inside the block. Like the legacy product blocks, the Items block works only in Architect Email campaigns.
What you need | Legacy editor | New editor |
|---|---|---|
Abandoned cart products | Cart item product block, one per item (1–8) | Items block > Item Type: Cart > Abandoned Cart Item (1–8) |
Recently browsed products | Browsed item product block, one per item (1–8) | Items block > Item Type: Browsed > Last Browsed Item (1–8) |
Purchased products | Purchased item product block, one per item (1–8) | Items block > Item Type: Purchased > Last Purchased Item (1–8) |
Wishlist products | Wishlist item attributes from the dynamic content list | Wishlist item attributes from the dynamic content list (the Items block has no wishlist type) |
A single product detail in a custom layout | Dynamic content attributes such as Abandoned Cart Item Name (1) | Same attributes, inserted with Add Dynamic Content |
Show or hide product details | Edit the block's elements | Card Composition tab: Product Image, Name, Quantity, Price, Original Price, Button |
Layout | Fixed block layout | Orientation: Vertical or Horizontal |
To show products with the Items block:
In your Architect email, drag the Items block from the bottom of the left-hand toolbar into the email.
In the Settings tab, select the Item Type: Cart, Browsed, or Purchased.
Select the item slot, e.g., Abandoned Cart Item (1).
Choose the Orientation.
In the Card Composition tab, turn off the elements you do not need.
Click an element on the card to style it. For prices, you can set the currency symbol and position, Formatted price, price orientation, and Show Single Product Price.
To show more products, add another Items block and select a different slot, e.g., Abandoned Cart Item (2).
Give every Items block its own slot. Copying a block without changing its slot can cause rendering issues in the preview and the delivered email.
The Items block is not hidden when a user has no item for its slot. To avoid empty cards, wrap each block in a display condition that checks for items. Use these conditions:
Cart: {% if ins_apr_total_product_kind > 0 %}
Browsed: {% if browsed_item_total_product_count > 0 %}
For details, see Personalized Content in Architect Journeys.
Other differences between the editors
Most blocks, such as images, buttons, spacers, videos, banners, countdown timers, social icons, and footers, work the same way in both editors. The following features changed place or behavior.
Feature | Legacy editor | New editor |
|---|---|---|
Select a stripe, structure, or container > Conditions tab > Apply Display Conditions. Supports attributes and expressions. | Select a stripe, structure, or container > Settings tab > Apply Display Conditions. Also supports aggregates (agg_), lookup tables (lk_), and array of objects attributes. | |
Algorithm configured inside each block | In Email campaigns, each block runs on a reusable Recommendation Strategy. Existing blocks keep their settings and keep sending. | |
Saving recommendation blocks as modules | Not available | Available: modules can include custom blocks such as recommendation blocks. |
Requires a support ticket to enable | Requires a support ticket to enable. Turn on Synchronized when you save the module. Display conditions do not work in synchronized modules in either editor. | |
Available | Every Autosave records a version. You can name, tag, search, and restore versions, or restore one as a new version. | |
Mobile design | Responsive design toggle | Mobile view in the editor, with separate mobile settings such as line height, banner image size, borders, and background image position. |
Text block with AI assistant | Insert images inside a text block, Improve with AI, and AI content and translation in 100+ languages that keeps merge tags intact. | |
Images | Image Library | AI image generation, Iconify icons, and drag and drop from the gallery |
Not available | Checks alt text, color contrast, and structure. | |
Not available | AI-generated AMP widgets, such as scratch cards, polls, and puzzles, with HTML fallbacks. | |
AMP | AMP blocks | AMP blocks plus HTML and AMP preview and AMP error highlighting in the editor |
Added outside the editor | Set up from the editor | |
Email size | Not shown | Email size indicator updates as you build. |
Keyboard shortcuts | — | Press L to open Structures & Modules and Shift + L to add a new structure. |
Find the matching new editor articles
Use this table to find the new-editor version of an article you know from the legacy editor.
Topic | Legacy editor article | New editor article |
|---|---|---|
Editor overview | ||
Build an email | ||
General settings | ||
Dynamic content | Same article (syntax reference) | |
Liquid | — | |
Text | ||
Images | ||
Buttons | ||
Spacer, video, social icons | ||
Banners | ||
Countdown timers | ||
Footer | ||
Anchor links | ||
Coupons | ||
Recommendations | Email Recommendation Block, with Reusable Recommendation Strategies | |
Cart, browsed, purchased products | ||
Display conditions | ||
Product modules | ||
Saved modules | ||
Synchronized modules | ||
AMP | ||
Gmail annotations | ||
Unsubscribe pages | ||
Preview and test | ||
Version history | ||
Export and templates | ||
New-editor-only features | — |