For AI agents: the complete documentation index is available at https://docs.clickmax.io/en/llms.txt, the full documentation bundle is available at https://docs.clickmax.io/en/llms-full.txt, and this page is available as Markdown at https://docs.clickmax.io/en/features/messaging/email-builder.md.
  • English

      • 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

      1. Open the Conteúdo tab. With nothing selected, it lists the blocks from most to least used: Título (heading), Parágrafo (paragraph), Texto (free text), Botão (button), Imagem (image), Vídeo (video), Cabeçalho (header), Rodapé (footer), Divisor (divider), Distanciador (spacer), Table, Lista (list) and Menu, with the Importar HTML (import HTML) shortcut at the end. In a broadcast, Descadastro (unsubscribe) shows up too, right after Rodapé. In an automation or a broadcast, Consentimento (consent) shows up too, right after Menu.
      2. 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.
      3. 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).
      4. 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.
      5. 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 also applies to parts of the email that are not blocks from the list, like a box that came inside an imported template: click it 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. Arredondamento dos cantos also has three shortcuts — Reto (square, 0 px), Suave (soft, 8 px) and Arredondado (rounded, 16 px) — that apply the value to all four corners in one click; for any other value, use the number field below them.

      The content area

      Every email has a background and, on top of it, a content area — the card that holds the blocks. It is the only place content goes:

      • Blocks added with nothing selected, or with the content area itself selected, go to the end of the content area. With a block selected, the new one goes right after it.
      • If you drop a block in the space around the email, it goes inside the content area: to the start if you dropped it above the email, to the end if you dropped it below.
      • Click the content area to open its properties: Largura (width), Alinhamento (alignment: Esquerda/left or Centro/center), Cor de fundo (background color), Preenchimento (padding), Borda (border) and Arredondamento dos cantos (corner rounding). Width, alignment and color are the same ones as in the Configuração tab — changing one place changes the other.
      • The content area cannot be dragged, duplicated or deleted, so the Duplicar (duplicate) and Excluir (delete) buttons do not show while it is selected.
      • The background is not a block and cannot be selected. The background color and image live in the Configuração tab.
      • Cabeçalho (header) and Rodapé (footer) sit outside the content area, right on the background. When you drag the Cabeçalho block, the drop area shows up above the content area; with Rodapé, below it. Each one can be added only once. The block arrives empty, with the hint Arraste blocos para cá (drag blocks here): it is a field where you drop the image, text and any other blocks you want. With the header or footer selected, the new block goes into it. Width and alignment follow the content area. The Cabeçalho block is not the same as the Cabeçalho field on the broadcast send screen, which is the inbox preview line.
      • Descadastro (unsubscribe, broadcast only) shows where the unsubscribe link goes — usually inside the footer. You choose the text and the alignment (Alinhar: left, center or right); the destination is filled in at send time for each person and cannot be changed. Without this block, the link is added automatically at the end of the email. In automations the block does not show, because those emails do not carry an unsubscribe link.
      • Consentimento (consent, automations and broadcasts) is the Confirmar inscrição (confirm subscription) button for double opt-in. You choose the text, colors and shape; the destination is filled in at send time with a unique link for each person and cannot be changed. In a test email the button opens a sample page that does not confirm anyone. To set up the whole automation, see How do I ask a lead to confirm their email subscription?.
      • In the blank template, the light box holding the logo, title, benefits and button is the content area itself: changing Cor de fundo da área do conteúdo (content area background, in the Configuração tab or by clicking the area) changes that box, and the color looks the same in the editor, in the preview and in the sent email.

      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.

      Adjust padding and margin by dragging

      With a block selected, small bars show up on its edges: the green ones adjust the padding (the space between the edge and the content) and the orange ones adjust the margin (the space between the block and its neighbors). The colored bands around the block show the space that already exists.

      1. Click the block inside the email. On text, the cursor goes into the text and the bars stay visible.
      2. Drag a bar: the green one increases the padding when you pull it into the block; the orange one increases the margin when you pull it away from it. The value in pixels shows next to the cursor while you drag.
      3. Hold Shift while dragging to change the opposite side too (top and bottom, or left and right, with the same value).
      4. Release. The block properties in the Conteúdo tab already show the new value, and a single Desfazer (Undo) reverts the whole drag.

      The Distanciador (spacer) block has no bars: its height already is the space, and you set it in the block properties.

      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.

      1. Negrito (bold), Itálico (italic), Sublinhado (underline) and Tachado (strikethrough) toggle on each click.
      2. 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.
      3. Emoji opens a short list; click one and it replaces the selection.
      4. 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.
      5. 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.
      6. 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 shows the images you have already uploaded to ClickMax — see Use an image from the gallery.
      • 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.

      The Galeria (gallery) tab shows the images in the Drive's Imagens de e-mails (email images) folder in place of the email. No window opens: the email stays as it was underneath, and you get back to it through the Edição tab.

      1. Decide where the image goes. The gallery follows this order:

        • Swap an image already in the email: click it before opening the gallery.
        • Fill an empty image field: if the email has an Imagem block with no image yet, the chosen one goes into it (the first one, top to bottom) — no need to select it.
        • Insert a new image: with no image selected and no empty field, it goes after the selected block, or at the end of the content area if nothing is selected.

        The text at the top of the gallery confirms what will happen: replace the selected image, fill the empty image field, or insert it into the email.

      2. Click the Galeria tab (the same gallery as the page editor). Clicking an empty Imagem block, Adicionar imagem (add image) in the image panel, or Trocar imagem (swap image) in the bar above it also opens the gallery, already pointed at that image.

      3. Find the image: filter by folder in the Pastas (folders) column (or stay on Todos os arquivos, all files), use Buscar por nome (search by name), or change the order between Mais recentes (newest), Nome (A–Z) and Nome (Z–A).

      4. Hover over the image and click Usar (use), or double-click it. The editor goes back to the Edição tab with the image already in the email.

      To upload a new image, click Enviar imagem (upload image) or drag files from your computer onto the gallery. Each file can be up to 5 MB, and the email gallery only takes images. The uploaded image goes to the top of the list, in whichever folder is open.

      Click an image (anywhere but Usar) to open Detalhes da imagem (image details) on the right. There you change the Nome do arquivo (file name), the Texto alternativo (alt text) — shown when the email app blocks images and read by screen readers — and the Pasta (folder), then confirm with Salvar. Excluir (delete) removes the image from the gallery after you confirm.

      New subfolders of Imagens de e-mails are created in the Drive; in the gallery they are there to filter.

      Search photos in the External library

      At the top of the left column, Biblioteca externa (External library) searches free Unsplash photos. It opens with "Paisagem" (landscape) photos; type another topic in the search field to change it. Click a photo to use it: Clickmax saves a copy in your email gallery and places the image in the email. The image in the email points to a Clickmax address, not to Unsplash.

      Bring an image from the Drive

      In Do seu Drive (From your Drive), at the bottom of the left column, you browse Meu drive (My drive) and the team spaces you can access, including private folders. When you click an image, Clickmax creates a copy of it in the email gallery and places it in the email. The original file stays private in the Drive.

      Build columns

      1. Open the Linhas tab. It shows 12 ready-made column layouts, from a single full-width column to six equal columns.
      2. Drag the layout to the spot in the email where it belongs. Each column becomes an independent area: drop content blocks inside each one.
      3. Click the row to open its properties: background color and image, borders, corner rounding, padding, vertical alignment, and Espaçamento (spacing) between the columns.
      4. Click one specific column to give it its own Fundo da coluna (column background), Preenchimento (padding) and Borda (border), without touching the others.
      5. 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.

      1. 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).
      2. 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.
      3. 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.
      4. 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.
      5. 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.
      6. 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

      1. Select the block (or the row) and find Esconder (hide) in its properties.
      2. 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).

      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 green and orange bars do not show up: select a single block. They stay hidden with more than one block selected, while you drag a new block in, and on the Distanciador block.
      • The panel disappeared: it was collapsed. Click the small arrow on the left edge of the canvas to bring it back.
      • I dropped a paragraph above (or below) the content area and it went inside it: only the Cabeçalho and Rodapé blocks go outside the content area. Add the header (or footer) first and drop the paragraph inside it.
      • I dropped a block outside the email and it showed up at the end (or start) of the content area: that is expected — content only lives inside the content area. Drag the block to the right spot inside it. If you are building columns, drop it inside a column.
      • I cannot select the email background: the background is not a block. Change the background color or image in the Configuração tab.
      • I changed the content area color and the light box of an old email stayed the same: emails created from the blank template before this change have a second box inside the content area. It is a regular block: click it and change its Cor de fundo (background color), or start a new email from the blank template.
      • An old email had a block outside the content area, or the background and spacing showed up twice: open the email in the editor and save. The block moves inside the content area and the email ends up with a single background and content area.
      • 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.
      • I used a gallery image and it was added as a new image instead of replacing the old one: the old image was not selected. Go back to Edição, click the image you want to swap, and only then open Galeria.
      • The image landed in an empty image field I did not want to fill: with no image selected, the gallery fills the empty field first. Select the image you want to swap before opening the gallery, or delete the empty Imagem block.
      • The image did not upload: check that the file is an image and is 5 MB or less. The reason shows in the list just below the gallery bar.