Visual Editor

Where you edit content with visual blocks

Experiment

This is currently an experimental feature. If you're an Admin, you can enable it in Workspace Settings > Experiments to give everyone access.

Welcome to our new editor! You know Parcel as an easy way to code emails. Now, we're building a visually friendly way to create emails! This is the first of many releases for our Visual Editor. Send us feedback anytime! We'd love to hear from you.

Overview

Right now, you can create an email in our Code Editor and modify text, images, and links in the Visual Editor. You'll first need to toggle the experimental feature on. Then you'll see a dropdown in the top left of the editor where you can switch between Code and Visual editing experiences.

Silent video of the full Parcel window and the code editor open. The cursor moves to the top left dropdown that shows Code, clicks it, and selects Visual. The new visual editor appears. The cursor moves to the header tag and hovers over the image at the end of the line. The cursor select img then clicks the pencil icon and a modal appears. The image source is edited. The cursor clicks x and closes the modal. The curose moves to a link in a paragraph below. The linked word is double clicked then the link source is edited. Finally, the cursor moves down to a bulleted list and edits the text of several list items."
Screen recording that shows modifying images, links, and lists in the Visual Editor

Currently, you can edit, but not create:

  • text within the following HTML tags: p, h1, h2, h3, h4, h5, h6, a, li
  • images including the source and alt text for accessibility
  • links for both text and images

But don't worry! We'll be adding in the ability to insert and rearrange links, images, components, and more as we continue to develop the Visual Editor.

Upcoming Releases

The Visual Editor is a work in progress. In the coming months, we will release the ability to:

  1. Move, delete, and duplicate components
  2. Create messages from scratch
  3. Save brand styles
  4. Save custom components
Previous ArticleNext Article