Enabling Edit Mode
You can enter Edit Mode by clicking on the Edit button in the chat toolbar.
Selecting Elements
When hovering over the preview, selectable components are highlighted. Clicking an element opens its modifiers in the side panel. From there you can update text, adjust styling, or swap out products.
Modifying Elements
After selecting an element, you can edit it in two ways:1. Using Prompts (for larger or structural edits)
Type what you want in plain English. Examples:- “Add a button under this text”
- “Turn this into a three-column grid”
- “Make this a product buy box for @Product”
2. Using Modifiers (for visual or precise changes)
The left-hand panel shows all available modifiers for the selected element. Common options include:- Text: edit copy, apply bold/italic/underline, change alignment
- Typography: font family, size, weight, line height, spacing
- Color: choose from styles, custom hex codes, or shop styles (
primary,secondary) - Layout: margin, padding, gap
- Appearance: opacity, border, radius, shadow
- Background: solid colors or style tokens
- Products: swap the product attached to a section, update variants, or link data
Modifiers update instantly — no need to hit save. Edits auto-save in the background, but won’t be shown on the live page until you publish.
Deleting Elements
You can select an entire section or a specific element, then press the trash icon to delete that element. You can always restore deleted elements using Version History.Product Sections
When you attach a product, Edit Mode can automatically build a product buy-box. Some of the things Replo AI can automatically add, if you ask it to:- Product image carousels
- Dynamic titles, prices, descriptions, strikethrough/compare-at prices
- Variant/option/quantity selectors
- Example content like FAQs, review layouts, etc
- Add to Cart and Checkout buttons
- Subscribe and Save / Selling Plan tabs and dropdowns
- Bundle builders
- Checkboxes for free gifts and product upsell offers