How do I build the email content in the editor?
The full email editor has a single panel, on the left, with three tabs: Conteúdo (Content — the blocks, and the properties of whichever block you select), Linhas (Rows — the column layouts) and Configuração (Settings — everything that applies to the whole email). There is no right-hand panel any more, and no separate Layers, Blocks and Style tabs: styling and properties now live inside the Conteúdo tab.
The editor's panel labels are shown in Portuguese; the English name is given in parentheses the first time each one appears below.
Role: any member with edit access in the workspace.
Before you start
- An email open in the full editor, from an email broadcast or from a Send email automation step. See how to create the content of an automation email.
- The subject is not in the editor. Subject and sender are filled in outside it: on the broadcast send screen, or on the email step card in the automation. The Configuração tab has no subject field on purpose — sending reads the subject from that other place, and having two fields would make whatever you typed here disappear at send time.
- If the panel is not visible, it is collapsed: click the small arrow on the left edge of the canvas to open it.
Add a block
- Open the Conteúdo tab. With nothing selected, it lists the 16 available blocks: Título (heading), Parágrafo (paragraph), Lista (list), Imagem (image), Botão (button), Table, Divisor (divider), Distanciador (spacer), Redes sociais (social links), HTML, Vídeo (video), Ícones (icons), Menu, Texto (free text), Consentimento (consent) and Importar HTML (import HTML).
- Drag the block to the spot in the email where it belongs. That is how content is added: you choose the position by where you drop it. Clicking a block in the list does not add anything.
- Click the block inside the email. The Conteúdo tab swaps the block list for that block's properties, with its name at the top and three buttons: Duplicar (duplicate), Excluir (delete) and Fechar (close).
- Adjust what you need. The options change per block: a Botão has label, colors, corner radius and link destination; an Imagem has file, alt text and link; a Lista has type, style and item indentation.
- To go back to the block list, click Fechar (close) or the Conteúdo tab itself. Both only clear the selection — nothing you adjusted is undone.
This applies to any part of the email, not just the blocks in the list. Click an area that is not a block — the body, the content area, a box that came inside an imported template — and you get its properties: Cor de fundo (background color), Preenchimento (padding), Margem (margin), Borda (border style, width and color) and Arredondamento dos cantos (corner rounding). Padding, margin, border and corners each have a Mais opções (more options) switch: off, the value applies to all four sides at once; on, you set each side (or corner) separately.
The Importar HTML block and the Importar HTML shortcut at the end of the block list do different things: the block puts the imported HTML inside itself, in the middle of the email you already built; the shortcut replaces the whole email with the imported HTML.
Both open the same dialog, which has an Informações sobre a importação (about the import) button in its footer. It spells out what the editor does with your file: the layout is handled as tables; <script> tags, event attributes and javascript: links are removed; inline styles always survive, while a <style> block in the file is only reused when you replace the whole email (all-or-nothing — one syntax error drops the sheet) and is discarded in the Importar HTML block; and the file must be 2 MB or smaller. Opening it does not close the dialog: the file you picked and the HTML you pasted stay put.
After importing, open the Configuração tab: the editor adopts the width and colors it could read from the file, and that is where you fix whatever came out different.
Format a piece of text
Click any text in the email — heading, paragraph, list, free text, table cell — and two things happen: the cursor lands in the text at the exact spot you clicked, and a floating bar appears always centered in the editor, just above the block. It carries everything that applies to text; the whole block's properties stay in the Conteúdo tab.
The bar does not move around as you select text — it always sits in the same place, so you never have to look for it.
On a Botão (button) the bar shows up too and the cursor lands in the label: you can type straight into the button and use bold, italic, underline, strikethrough, emoji, clear formatting and variables — handy for a label like "Começar agora, {{firstName}}". Color and link destination are not on the bar because they are already the button's own properties, in the Conteúdo tab.
Esc closes it in layers: if a list is open (colors, emoji, variables), the first Esc closes just that; the next one closes the bar. The cursor stays where it was, and the bar comes back as soon as you click the text again.
With a stretch selected, each action applies only to it. With the cursor just blinking and nothing selected, actions apply to the whole block: clicking bold with the cursor in a paragraph makes the entire paragraph bold. The exceptions are Emoji and Adicionar variável, which always land at the cursor.
- Negrito (bold), Itálico (italic), Sublinhado (underline) and Tachado (strikethrough) toggle on each click.
- Cor do texto (text color) and Marcador de texto (highlight) sit side by side and work the same way: the small bar under the icon shows the color the button applies, and the caret next to it opens the list. The list holds the colors you already used, the suggestions, Sem cor (clears the color or the highlight) and the palette, which opens your computer's color picker for any shade. Every color you pick goes into Usadas recentemente, kept per use — text colors never mix with highlight colors.
- Emoji opens a short list; click one and it replaces the selection.
- Limpar formatação (clear formatting) strips bold, italic, colors and highlights from the selected text. Links stay links, they just go back to the default look. The rest of the paragraph is untouched.
- Transformar em link turns the selection into a link. Click the link afterwards for its options: text, address, Visitar link (visit) and Remover link (remove link), which undoes the link and keeps the text in place.
- Adicionar variável opens the list of contact data (name, email, phone and your workspace's own fields) and inserts the one you pick exactly where the cursor is. This is where variables go into the email — the top toolbar no longer has that button, because there was no cursor there to say which point in the text the variable should land on.
The top bar
The bar above the email has three parts:
- On the left: when you are editing inside a send, the Voltar (back) arrow, which does the same as Salvar (finishes editing and takes you back to the send's configuration screen). Then Desfazer and Refazer (undo and redo) and Destacar elementos (highlight elements), which outlines every block so you can see the message's structure.
- In the center: the Edição and Galeria tabs. The gallery is not available yet — the tab shows up disabled so you know it is coming.
- On the right: Desktop and Mobile (how the email looks on each screen), Visualizar e-mail (preview), Expandir editor (the editor takes over the whole window; the same button brings it back) and, when you are editing inside a send, Salvar, which finishes editing and takes you back to the send's configuration screen.
The Salvando... / Tudo salvo notice shows up in the corner, just below the bar, and disappears on its own after a few seconds. It is not permanent because the email is saved on every change: the notice is there to report the save, not to sit on screen.
Build columns
- Open the Linhas tab. It shows 12 ready-made column layouts, from a single full-width column to six equal columns.
- Drag the layout to the spot in the email where it belongs. Each column becomes an independent area: drop content blocks inside each one.
- Click the row to open its properties: background color and image, borders, corner rounding, padding, vertical alignment, and Espaçamento (spacing) between the columns.
- Click one specific column to give it its own Fundo da coluna (column background), Preenchimento (padding) and Borda (border), without touching the others.
- Under Empilhar no celular (stack on mobile), decide whether the columns stay side by side or sit one below the other on small screens. With stacking on, Ordem ao empilhar (stacking order) chooses between Normal and Invertida (reversed) — useful when the image is on the right on a computer and you want it to come before the text on a phone.
To check the result, use the Desktop and Mobile buttons in the editor toolbar.
Adjust the whole email
Open the Configuração tab. Nothing here depends on a selected block — it all applies to the entire message.
- Under Largura da área do conteúdo (content area width), drag the control to set how wide the content block is, and choose the Alinhamento da área do conteúdo (content area alignment): Esquerda (left) or Centro (center).
- Set Cor de fundo (the area around the content), Cor de fundo da área do conteúdo (the content area itself) and, if you want, turn on Imagem de fundo (background image) and give the image URL. The color you pick is the one the sent email uses, even if the template or source HTML had a different color there.
- Choose the email's Fonte padrão (default font) and Cor do link (link color). Blocks with no font of their own inherit this one.
- Fill in the Preheader (only in editors that do not have their own Cabeçalho field — see below): this is the snippet of text that shows next to the subject line in the inbox, before anyone opens the email. The field takes up to 130 characters, and the counter below it shows how many you have used. With no preheader, email apps usually show the first words of the email itself there instead.
- Under Língua (language), declare the language of the message, or leave it on Não declarar (do not declare). It helps screen readers and the automatic translation some apps offer.
- Custom head HTML is a field for advanced users: the code you put there goes into the email that is sent and can affect how the message is displayed. Scripts, iframes and
javascript:links are stripped automatically. Use Expandir (expand) to edit it in a larger window.
On the broadcast send screen and on the automation's email step, the preview line is the Cabeçalho (header) field, outside the editor — so the Preheader field does not show in the Configuração tab there. The Cabeçalho is the only text sent as the preview: if the content carries another preview line (copied from an older email, for example), it is removed when you save. When the email is sent, the Cabeçalho shows on its own in the inbox, without the first words of the email tacked on after it.
Email imported as full HTML
If the whole email came from HTML (through the Importar HTML shortcut, or created by Max from a design), the colors, alignment, font and link color are the HTML's own. In that case the Configuração tab shows a notice and those fields are disabled. To change a color, click the element inside the email and change its Cor de fundo in the properties.
Hide a block on desktop or mobile
- Select the block (or the row) and find Esconder (hide) in its properties.
- Choose OFF (always visible), Desktop (hidden on computers) or Mobile (hidden on phones).
This depends on the recipient's email app. Hiding by screen type is an instruction the app can simply ignore — and then the block shows up anyway, or stays hidden on both. Do not use this control to hide something that must not be read; use it to tune what reads better on each screen. The same warning applies to a table's Linhas listradas (striped rows — the app may show the table with no stripes) and to column stacking on mobile (the app may keep the columns side by side).
Related
- Send a broadcast
- How to create the content of an automation email
- My email went out with the ClickMax logo. How do I use mine?
- Email domain
If it did not work
- I cannot find where to change the text color or size: click the block inside the email — its properties open in the Conteúdo tab itself, replacing the block list. There is no right-hand panel any more.
- I cannot find the subject field: it is not in the editor. Fill it in on the broadcast send screen or on the automation's email step card.
- The panel disappeared: it was collapsed. Click the small arrow on the left edge of the canvas to bring it back.
- I dragged a block and nothing happened: drop the block over the email, not outside it. The grey area around it does not take content. If you are building columns, drop it inside a column.
- I changed the background color and, after saving, the preview or the sent email went back to the old color: if the Configuração tab shows the full-HTML notice, the color comes from the HTML itself — click the colored element inside the email and change its Cor de fundo. Without the notice, open the email, pick the color again and save.
- Another text shows up next to the Cabeçalho in the inbox: the email still carries an old preview line. Open the email step (or the broadcast), check the Cabeçalho and save — the old line is removed.
- A hidden block showed up anyway for the recipient: their email app ignored the rule. See the warning in the section above.
- The divider ran across the whole email in Outlook: this happened with emails saved before the fix. Open the email in the editor and save it again: the divider then stays within the content width in Outlook for Windows too.
- The button arrived with square corners in Outlook: Outlook for Windows doesn't draw rounded corners. The button keeps its color, size, alignment and link; only the corners are square in that app. Everywhere else it looks the way you built it.
- The image showed up as a red X in Outlook: the image is probably WEBP. Outlook for Windows doesn't display that format. The editor accepts WEBP and warns you when you upload the file, but to make sure everyone sees the image, replace it with a JPG or PNG version. If the image shows as an empty box with an option to download pictures, Outlook is blocking images from the sender: the recipient needs to allow them. While the image is blocked, the Texto alternativo (alt text) shows in its place. When you upload an image, the editor fills that field with the file name, when the name describes something (names like "IMG_2024…" stay blank). Review the text in the image properties.