# Construtor de e-mail Os e-mails para campanhas de e-mail podem ser montados de acordo com o seu design usando blocos.
Textos, botões, mensageiros, imagens, assim como ferramentas para personalização de blocos — este é um nível de design completamente novo. Esqueça os modelos entediantes — crie e-mails exclusivos e com a sua marca com a Mavibot. ## Seções (blocos) para e-mails Você pode encontrar o construtor de e-mails na aba “Emails” ao criar uma campanha de e-mail:
No construtor, você verá uma tela em branco onde poderá inserir os seguintes blocos (seções): 1. Imagem 2. Texto 3. Bloco vazio 4. Botão 5. Redes sociais 6. Bloco HTML Além disso, os blocos podem ser combinados entre si — por exemplo, você pode adicionar vários elementos de e-mail dentro de uma única seção.
Cada bloco inclui configurações gerais de exibição da seção, como: 1. Preenchimento interno; 2. Borda; 3. Raio da borda; 4. Fundo.
Vamos começar revisando as configurações disponíveis para cada seção. Depois, vamos passar por um exemplo para mostrar como você pode personalizar vários blocos diferentes dentro de uma única seção. ### Imagem Para adicionar uma imagem, vá ao menu no lado direito da tela. Lá, você encontrará um ícone que permite fazer upload de uma imagem ao clicar:
Quando você clicar no botão, verá que a seção foi adicionada ao e-mail:
Para adicionar uma imagem, vá até a aba correspondente e envie o arquivo de que precisa a partir do seu dispositivo:
Em seguida, você verá que a imagem foi adicionada à seção:
Você pode transformar a imagem em um elemento semelhante a um botão para que, quando os destinatários clicarem nela no e-mail, sejam redirecionados para uma página específica. Para fazer isso, basta inserir o link desejado no campo fornecido:
### Texto Um bloco de texto pode ser adicionado dentro de uma seção que contenha uma imagem (ou qualquer outro bloco), ou como um bloco separado por conta própria. {% hint style="warning" %} Atenção! A alteração de fontes não está disponível. {% endhint %} 1. Para adicionar texto dentro de uma seção — como uma com imagem — passe o mouse sobre o bloco de imagem (ou qualquer outro bloco à direita) e procure o ícone "+":
Em seguida, clique no ícone de mais, e um menu suspenso com opções de bloco aparecerá:
Como você pode ver, o bloco de texto foi adicionado dentro da seção que já contém uma imagem:
{% hint style="info" %} Atenção! Você pode adicionar até quatro elementos de conteúdo (blocos) dentro de uma única seção. {% endhint %} 2. Para adicionar uma seção separada no e-mail com um bloco de texto (ou qualquer outro bloco), passe o mouse sobre o lado esquerdo da tela e encontre o ícone "+" no menu de ações rápidas:
Em seguida, clique no ícone de mais e selecione a seção que deseja adicionar:
Uma nova seção com um bloco de texto será então adicionada:
Para editar, clique no texto, e uma barra de ferramentas com configurações — semelhantes às de qualquer editor de texto — aparecerá acima.
Na barra de ferramentas acima do bloco de texto, você pode aplicar formatação em negrito, itálico e sublinhado:
Você também pode formatar o texto como lista, adicionar um link e alinhá-lo à esquerda, à direita ou ao centro. Para ajustar o tamanho da fonte, a altura da linha, o espaçamento e a cor, vá para as configurações do bloco "Texto" no menu à direita:
### Botão Um bloco de botão é adicionado da mesma forma que qualquer outro bloco: ele pode ser colocado como uma seção separada ou dentro de uma seção existente com outros elementos:
Você pode inserir um link para qualquer página necessária no botão.:
Para alterar o texto, clique no campo de texto dentro do botão:
Depois, insira o texto desejado:
Para alterar o tamanho do botão, localize o campo com setas no menu:
Em seguida, defina o tamanho necessário inserindo um valor numérico — o campo aceita valores em pixels. Para alterar o alinhamento do botão (centralizado, à esquerda ou à direita), use estas configurações:
O menu também contém um campo para alterar a cor do botão:
### Botões de "Redes sociais" No e-mail, você também pode adicionar botões que redirecionarão os destinatários para as plataformas de redes sociais conectadas ao seu projeto:
Nas configurações do bloco, você pode escolher para qual canal específico deseja redirecionar seus clientes:
O menu de configurações também inclui uma opção de estilo para botões de redes sociais:
1. Padrão: usa o estilo original dos ícones do mensageiro:
2. com borda: ícones transparentes com uma cor de borda correspondente às cores padrão do respectivo mensageiro.
3. Monocromático: ícones exibidos em um único esquema de cores.
Para arredondar os cantos dos ícones, insira o valor numérico desejado em pixels no campo "Cantos arredondados":
## Configurações do Bloco Dentro de uma Seção Cada elemento dentro de uma seção tem as mesmas configurações de preenchimento, bordas e fundo. Você pode configurar um bloco separadamente de cada elemento, além de escolher: ### Preenchimento do elemento Você pode ajustar o preenchimento do elemento nos campos correspondentes:
Esses preenchimentos referem-se especificamente à posição do bloco de conteúdo em relação à sua borda. ### Borda (interna) Uma seção contém duas bordas que podem ser personalizadas: a borda externa (para toda a seção) e a borda interna (para a imagem ou outros elementos). {% hint style="info" %} Instruções sobre como editar a borda externa da seção podem ser encontradas na seção "Configurações gerais da seção" -> Borda. ссылка "[Borda](#ramka)" {% endhint %} A borda interna que envolve o bloco de conteúdo pode ser personalizada com qualquer cor, espessura, além de bordas específicas para destaque e o estilo de linha desejado:
Cada lado da borda pode ser personalizado separadamente dos outros. Para fazer isso, clique no lado da borda que deseja editar:
Depois, selecione a cor, a espessura e o estilo de linha da borda. Para personalizar a borda em todos os quatro lados, clique no ícone correspondente:
#### Raio da borda Você também pode definir o raio dos cantos da borda interna em pixels:
Os campos para cada canto da borda aceitam valores numéricos em pixels.
### Fundo do Bloco de Conteúdo Dentro de uma Seção
O fundo interno, que se aplica apenas ao bloco contendo um elemento específico dentro da seção, pode ser definido ao enviar uma imagem ou selecionar uma cor na paleta de cores. Você também pode escolher a posição e o tamanho da imagem de fundo:
## Configurações da Seção Uma seção com elementos de conteúdo pode ser personalizada de forma diferente das outras seções do e-mail, aplicando cores de fundo, adicionando bordas e ajustando o preenchimento. ### Preenchimento O preenchimento da seção se aplica a todos os elementos localizados dentro da seção:
Para definir o preenchimento dos blocos em relação à borda externa de uma seção, arraste as bordas para ajustar a posição dos elementos em relação às bordas superior e inferior, bem como às bordas direita e esquerda.
Alternativamente, você pode definir valores numéricos nos campos localizados no menu à direita, na aba “Seção”:
### Borda Uma seção contém duas bordas personalizáveis: a borda externa (para toda a seção) e a borda interna (para uma imagem ou outros elementos) {% hint style="info" %} Instruções sobre como editar a borda externa da seção podem ser encontradas na seção "Borda (interna)" ссылка "[Borda (interna)](#ramka-vnutrennyaya)" {% endhint %} A borda externa, que enquadra toda a seção com blocos de conteúdo, pode ser personalizada usando qualquer cor e espessura, além de selecionar os lados desejados para destacar e o estilo da borda:
Cada lado da borda pode ser personalizado separadamente dos outros. Para fazer isso, clique no lado desejado da borda:
Depois, selecione a cor, a espessura e o estilo da borda. Para personalizar a borda em todos os quatro lados, clique no ícone correspondente:
### Raio da borda Você também pode definir o arredondamento dos cantos da borda da seção em pixels:
Os campos para cada canto da borda aceitam valores numéricos em pixels.
### Fundo
O fundo interno, que se aplica apenas à seção inteira, pode ser definido ao enviar uma imagem ou selecionar uma cor na paleta de cores. Você também pode escolher a posição e o tamanho da imagem de fundo:
--- # Agent Instructions: Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question. Perform an HTTP GET request on the current page URL with the `ask` query parameter: ``` GET https://docs.mavibot.ai/doc/pt/envios-empresariais/construtor-de-e-mail.md?ask= ``` The question should be specific, self-contained, and written in natural language. The response will contain a direct answer to the question and relevant excerpts and sources from the documentation. Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.