Editor de arrastar e soltar - Parte 4: configurar o estilo do design para todo o seu e-mail

O editor de arrastar e soltar facilita a criação de e-mails com aparência profissional. Ele fornece mais opções para personalizar seu e-mail e também garante que o e-mail pareça perfeito em qualquer cliente de e-mail e dispositivo.

Neste artigo, veremos como definir os estilos para todo o modelo na seção Design. Por exemplo, é possível definir a cor e o estilo do link (negrito, itálico) que serão aplicáveis a todos os links que você adicionar ao modelo. Dessa forma, você economiza tempo, pois não precisa definir os estilos separadamente para cada link.

Dividimos os artigos sobre o editor de arrastar e soltar nas seguintes partes:

Para começar, assista ao nosso vídeo detalhado sobre como usar a guia Design (Criar) no Editor de arrastar e soltar 🚀.

Quais são as diferentes configurações na guia Design (Criar)?

As configurações são divididas em 5 partes: Brand library (Biblioteca de marcas)Template (Modelo), Text Appearance (Aparência do texto), Buttons (Botões) e Spacing (Espaçamento).

Brand library (Biblioteca de marcas)

brand-library_EN-US.png Configure sua Brand library (Biblioteca de marca) para que cada novo modelo selecionado herde as propriedades de sua marca, como logotipo, cores, fontes e links de redes sociais. Além de economizar seu tempo, a Brand Library (Biblioteca de marca) permite que você mantenha uma marca de e-mail consistente. Para saber mais, consulte nosso artigo dedicado Crie automaticamente seus e-mails com seus ativos de marca usando a Biblioteca de marca.

Template (Modelo)

As configurações de plano de fundo e largura dos blocos de conteúdo podem ser ajustadas a partir daqui.

dde_template-settings_EN-US.png

Background color (Cor de fundo)

Escolha uma cor de fundo que será aplicada a todos os blocos de conteúdo de sua campanha em toda a largura. Se você quiser que o corpo tenha apenas uma cor de fundo, escolha uma cor na configuração Body color (Cor do corpo) abaixo.

dde_background-color_EN-US.png

Background image (Imagem de fundo)

Você pode adicionar uma imagem de seus arquivos ou das imagens de estoque clicando em Add background image (Adicionar imagem de fundo) ou adicionar diretamente Insert image from URL (Inserir imagem do URL ) colando o link da imagem nesse campo. Você pode ajustar a posição, a repetição e o tamanho da imagem conforme necessário.

dde_background-image_EN-US.png

Body color (Cor do corpo)

Estas opções permitem que você adicione uma cor de plano de fundo apenas ao corpo, como no exemplo abaixo, em azul.

dde_body-color_En-US.png

Body Width (Largura do corpo)

Ajuste a largura do bloco de conteúdo em pixeis. Por padrão, a largura está configurada em 600px. Quando você altera a largura, os blocos de layout e conteúdo são automaticamente redimensionados. A largura do corpo é representada pela seta amarela na imagem abaixo.

dde_body-width_EN-US.png

View in browser (Ver no navegador)

Alterne essa opção para permitir que seus destinatários visualizem uma versão on-line de sua campanha de e-mail se tiverem problemas para exibi-la em seus clientes de e-mail. Um link View in browser (Visualizar no navegador) será adicionado automaticamente na parte superior do e-mail. Para saber mais, consulte nosso artigo dedicado Inserir um link Visualizar no navegador (espelho) em suas campanhas.

DEE_view-browser_EN-US.png

Text appearance (Aparência do texto)

💡 É bom saber
Configure sua biblioteca de marcas para escolher as fontes a serem usadas por padrão em seus cabeçalhos e parágrafos. Para saber mais, consulte nosso artigo dedicado Crie automaticamente seus e-mails com seus ativos de marca usando a Biblioteca de marcas.

Você pode escolher a aparência do texto de todos os estilos (parágrafos, cabeçalhos etc.). Para cada estilo, defina a família, o tamanho e a cor da fonte nas respectivas listas. Clique em um dos nomes das fontes e clique em + Manage fonts (+ Gerenciar fontes) se quiser adicionar fontes do Google Fonts às suas listas ou escolher fontes alternativas caso os destinatários não consigam ver a fonte que você escolheu primeiro. 

DDE_text-appearance-fonts_EN-US.gif

Nas Common settings (Configurações comuns), você poderá escolher a altura da linha entre as padrão ou criar uma altura personalizada e escolher a direção da escrita (da esquerda para a direita ou da direita para a esquerda).

Você também pode alterar a fonte de uma parte específica do design selecionando o texto e escolhendo a fonte na barra de formatação na parte superior do bloco Text (Texto).

❗️ Importante
Se você tiver alterado a fonte manualmente, selecionando o texto e usando a barra de formatação, a fonte não será alterada quando você escolher uma fonte em Design > Text Appearance (Aparência do texto).

Buttons (Botões)

A partir daí, você pode definir o estilo padrão de todos os botões do seu boletim informativo. Se você quiser alterar o aspecto de todos os botões rapidamente, faça isso aqui!
Você pode escolher o estilo e o tamanho da fonte, a largura, o raio, a cor e o tamanho e a cor da borda.  

mceclip0.png

Spacing (Espaçamento)

A configuração Spacing (Espaçamento) está disponível na guia Design (Criar), mas também quando você clica em um bloco Style (Estilo). Ela permite que  você adicione Padding (Preenchimento), que é o espaço entre o elemento e a borda. Ele fica ao redor dos quatro lados do conteúdo e o tamanho de cada lado pode ser alterado.

Alterne o botão Padding (Preenchimento) para ativá-lo ou desativá-lo com um clique. Escolha o tamanho do preenchimento ou da margem que deseja adicionar a cada lado do conteúdo usando os botões +/- ou escrevendo o tamanho desejado no campo de texto. 

DEE_padding_EN-US.gif

⏩ O que vem a seguir?

🤔 Dúvidas?

Em caso de dúvida, sinta-se à vontade para entrar em contato com nossa equipe de suporte, criando um tíquete a partir da sua conta. Caso ainda não tenha uma conta, entre em contato conosco aqui.

💬 Este artigo foi útil?

Utilizadores que acharam útil: 4 de 27