Criar template com o editor Wake Experience

O Editor Wake Experience é uma ferramenta desenvolvida para facilitar a criação de e-mails marketing de forma personalizada, dinâmica e responsiva. Com uma interface drag and drop, é possível criar layouts adaptáveis para desktop e mobile, otimizando a performance das campanhas e melhorando a experiência do cliente.

⭐Principais Funcionalidades

📱 Editor Responsivo

• Controle de visualização e edição para desktop e mobile
• Layouts que se adaptam automaticamente ao dispositivo do cliente

🧱 Layouts Flexíveis

• Estruturas pré-definidas com até 6 colunas
• Personalização avançada de alinhamento e espaçamento

🎨 Elementos Visuais

• Texto: hiperlinks para preview, opt-out e CTAs
• Imagens: JPEG, PNG e GIF, com editor interno
• Vídeos: URLs do YouTube ou Vimeo
• Botões (CTA): formatos, cores e links personalizáveis
• Redes Sociais: ícones com links configuráveis

🔄 Integração com XML

• Inclusão automática de produtos, preços e imagens
• Ideal para campanhas dinâmicas com dados sempre atualizados

Como usar o editor

1️⃣ Acessar o editor

• No painel, vá em Campanhas, seleciona E-mail e em como quer citar a sua campanha, selecione Com o editor de e-mails Wake experience.

• Ou acesse Campanhas > Templates, clique em Criar com o Editor e selecione a opção Template em branco para criar um template do zero ou selecione um dos templates existentes para editá-lo.

2️⃣Montar o Layout (Drag and Drop)

• Utilize o recurso de arrastar e soltar para adicionar conteúdos como textos, imagens, botões e outros elementos.
  3️⃣Preencha os conteúdos escolhidos

• Título: Digite o título desejado e utilize as opções de edição de texto para personalizá-lo. 
  
  Em Title Properties, você pode ajustar tamanho, fonte, espessura, cor do texto, cor do link, alinhamento, altura, espaçamento entre letras, direção do texto e configurar as opções do bloco. Não se esqueça de definir a visualização para desktop e mobile.
  
  
• Parágrafo: Insira o texto e utilize as opções de formatação para adaptá-lo ao design do e-mail.
  
  Em Configurações do Parágrafo, você pode ajustar a fonte, espessura, tamanho, cor do texto e dos links, alinhamento, espaçamento entre parágrafos, altura da linha, espaçamento entre letras e direção do texto. Além disso, é possível configurar as opções do bloco para melhor disposição do conteúdo. Certifique-se de ajustar a visualização para desktop e mobile.
  
• Listagem: Insira o nome da listagem e utilize as opções de personalização para ajustar o formato do texto. 
  
  Em Configurações da Lista, você pode definir o tipo e estilo da lista, além de configurar a fonte, espessura, tamanho, cor do texto e dos links, alinhamento, espaçamento entre itens, recuo de itens alinhados, altura da linha, espaçamento entre letras e direção do texto. Também é possível ajustar as opções do bloco para melhor disposição do conteúdo. Não se esqueça de configurar a visualização para desktop e mobile.
  
  

• Imagem: Arraste e solte o arquivo ou clique em Procurar para selecionar a imagem desejada.
  
  Ao procurar, você pode fazer upload de uma imagem do seu computador ou escolher uma foto gratuita do nosso banco de imagens.

  

  Botão: Defina um nome para o botão e utilize os recursos de personalização para ajustar o texto.
   
  Em Configurações do Botão, você pode configurar o tipo de link, largura, fonte, espessura da fonte, tamanho da fonte, cor de fundo, cor do texto, alinhamento, espaçamento entre letras, curvatura, preenchimento, borda e direção do texto. Além disso, é possível ajustar as opções do bloco para melhor organização do conteúdo. Certifique-se de configurar corretamente para desktop e mobile.
  
  

• Tabela: Insira os dados que devem compor a tabela e utilize os recursos de formatação de texto para personalizá-los. 
  
  Em Configurações da Tabela, você pode ajustar a quantidade de colunas e linhas, borda, cor de fundo, ativar ou não linhas listradas e linha de cabeçalho, além de definir espessura e tamanho da fonte, cor do texto, cor do link, alinhamento, altura da linha, espaçamento entre letras e direção do texto. Também é possível configurar as opções do bloco para melhor organização do conteúdo. Certifique-se de ajustar corretamente para desktop e mobile.
  
  
• Divisor: No menu Configurações do Divisor, você pode definir se o elemento será transparente ou visível, ajustar a espessura da linha, largura, alinhamento e personalizar as opções do bloco para melhor organização do conteúdo. Certifique-se de configurar corretamente a visualização para desktop e mobile.
  
• Redes Sociais: No menu Configurações de Redes Sociais, insira a URL de cada rede e personalize a exibição conforme necessário. Você pode adicionar novos ícones, ajustar o alinhamento, definir o espaçamento entre os ícones e configurar as opções do bloco para melhor organização do conteúdo. Certifique-se de ajustar corretamente a visualização para desktop e mobile.
  
• HTML: Utilize código HTML personalizado para adicionar conteúdos avançados e personalizações extras ao e-mail.
  
• Vídeo: Insira vídeos através de links do YouTube ou Vimeo para tornar o e-mail mais dinâmico e interativo.
  
• Ícones: Em Configurações de Ícones, você pode alterar a imagem dos ícones, aplicar efeitos visuais, adicionar ou excluir ícones e personalizar sua exibição. Além disso, é possível ajustar a fonte, espessura e tamanho do texto, definir a cor do texto, alinhamento, espaçamento entre letras, tamanho dos ícones e o espaçamento entre eles para melhor organização do conteúdo.
• Menu: No menu Configurações de Menu, você pode adicionar itens preenchendo o texto, URL e título, além de definir onde o link será aberto. Também é possível personalizar a fonte, espessura e tamanho do texto, ajustar a cor do texto e do link, definir alinhamento, espaçamento entre letras, separador, formato hambúrguer e a distância entre os itens para melhor organização do conteúdo.
  
• Texto: Insira textos complementares e personalize-os conforme necessário. No menu Configurações de Texto, você pode personalizar a cor do texto e do link, além de ajustar a altura da linha e o espaçamento entre letras para melhor apresentação do conteúdo.
  

⚙️ Configurar HTML Dinâmico

• Inclua variáveis do XML para personalização

• Ajuste tamanhos, margens e paddings

  👀 Pré-visualizar e Ajustar

• Teste o layout em desktop e mobile
• Utilize a visualização mobile para garantir responsividade
  

🚀 Finalizar e Enviar

• Envie um teste para validação
• Ative o disparo para as audiências configuradas

🆕 Melhorias – Janeiro de 2025

📱 Visualização Mobile Aprimorada

• Pré-visualização e ajustes direto no editor
• Melhor controle de alinhamento e distribuição
  

🧩 Novas Configurações de Conteúdo

• Parágrafo: Insira blocos de texto com opções de formatação para descrições detalhadas.
• Tabelas: Organize informações como preços ou especificações em tabelas personalizáveis.
• Listagem: Crie listas para destacar benefícios ou etapas de forma clara.
• Distanciador: Adicione espaçamentos ajustáveis para melhorar o layout visual.

• Menu: Inclua menus horizontais com links para guiar o cliente a páginas específicas.
  
  
  🎯 Configurações Opcionais

•  
  • Imagem de Fundo no E-mail: Personalize o visual do e-mail adicionando uma imagem de fundo, tornando-o mais atrativo e alinhado à identidade visual da campanha.
    
  • Pre-Header, Título e Assunto (Meta Tag): Configure facilmente o pre-header, o título e o assunto para destacar a mensagem no inbox e aumentar a taxa de abertura.
    
  • Definição de Idioma do Template: Escolha o idioma padrão do template, garantindo compatibilidade e acessibilidade em diferentes contextos.
    

⚠️ Pontos de Atenção

• 📱 Responsividade: sempre revise no mobile
• 🖼️ Imagens: até 100 KB por imagem (máx. 600 KB no total)
• 🔄 XML atualizado: necessário para dados dinâmicos
• 🔎 Buscar produtos: a busca é feita exclusivamente pelo ID do produto cadastrado dentro do XML ou API (não é possível buscar pelo nome)

✅ Benefícios

• 🎨 Flexibilidade: personalização completa dos elementos
• 🤖 Automação: dados dinâmicos em tempo real via XML
• 💎 Melhor experiência: layouts profissionais em qualquer dispositivo

🏁 Conclusão

Com as melhorias de visualização mobile e personalização avançada, o editor oferece mais controle e eficiência na criação de campanhas. Utilize esses recursos para criar e-mails que se destacam pela responsividade e personalização.

📞 Suporte e Dúvidas
Entre em contato com nosso time pelo e-mail atendimento-xp@wake.tech ou via WhatsApp +55 11 97184-2450.