Pular para o conteúdo principal

Criar Template de Mensagem

Este guia explica como criar templates de mensagem no NotifyChain.

Acessando o Modulo​

  1. No menu lateral, clique em Mensagens
  2. Clique no botao Nova Mensagem

Informacoes Basicas​

Preencha os dados de identificacao:

  • Nome: Identificador interno (ex: "Email Boas-Vindas v2")
  • Descricao (opcional): Proposito e contexto do template

Configurando o Remetente​

Selecionar Remetente​

  1. Clique no campo Remetente
  2. Selecione um remetente configurado
  3. O email e nome de exibicao serao preenchidos
Remetentes

Voce precisa ter pelo menos um remetente configurado. Acesse Configuracoes > Remetentes para adicionar.

Reply-To (Opcional)​

Configure um email diferente para respostas:

  1. Marque Usar reply-to diferente
  2. Digite o email de resposta

Configurando o Assunto​

Assunto Principal​

Digite a linha de assunto:

Bem-vindo ao NotifyChain, {{contact.firstName}}!

Dicas:

  • Maximo 50 caracteres (visivel na maioria dos clientes)
  • Use personalizacao para aumentar abertura
  • Seja claro e direto
  • Evite ALL CAPS e exclamacoes excessivas

Pre-header​

Texto complementar que aparece apos o assunto:

Descubra como automatizar seu marketing em 5 minutos

Dicas:

  • 80-100 caracteres
  • Complemente o assunto, nao repita
  • Se deixar vazio, o inicio do email sera exibido

Criando o Conteudo​

Editor Visual​

O NotifyChain oferece um editor visual para criar emails:

Barra de Ferramentas:

  • Formatacao de texto (negrito, italico, sublinhado)
  • Alinhamento (esquerda, centro, direita)
  • Listas (ordenadas e nao ordenadas)
  • Links
  • Imagens

Blocos Disponiveis:

  • Texto
  • Imagem
  • Botao
  • Divisor
  • Espaco
  • Colunas

Adicionando Texto​

  1. Clique onde deseja inserir
  2. Digite o conteudo
  3. Use a barra de ferramentas para formatar

Inserir variavel:

  1. Digite {{ para abrir o seletor
  2. Escolha a variavel desejada
  3. A variavel sera inserida automaticamente

Adicionando Imagens​

  1. Clique em Inserir Imagem
  2. Faca upload ou cole URL
  3. Configure:
    • Alt text (obrigatorio para acessibilidade)
    • Largura
    • Link (opcional)
Tamanho de Imagens

Mantenha imagens abaixo de 200KB para carregamento rapido. Use formatos otimizados (JPG para fotos, PNG para graficos).

Adicionando Botoes​

  1. Clique em Inserir Botao
  2. Configure:
    • Texto do botao
    • URL de destino
    • Cor de fundo
    • Cor do texto
    • Tamanho

Exemplo:

Texto: "Comecar Agora"
URL: https://app.notifychain.io/onboarding
Cor: #00CC88 (verde primario)

Adicionando Links​

  1. Selecione o texto
  2. Clique em Inserir Link
  3. Digite a URL
  4. Links sao rastreados automaticamente

Modo HTML​

Para controle total, use o editor de codigo:

  1. Clique em Modo HTML
  2. Edite o codigo diretamente
  3. Clique em Visualizar para ver o resultado

Estrutura basica:

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body style="margin: 0; padding: 0; font-family: Arial, sans-serif;">
  <table width="100%" cellpadding="0" cellspacing="0">
    <tr>
      <td align="center">
        <table width="600" cellpadding="0" cellspacing="0">
          <!-- Conteudo aqui -->
        </table>
      </td>
    </tr>
  </table>
</body>
</html>

Design Responsivo​

Mobile First​

  • 60%+ dos emails sao abertos em mobile
  • Teste sempre em tela pequena
  • Use fonte minimo 14px
  • Botoes com altura minima de 44px

Media Queries​

@media only screen and (max-width: 480px) {
  .container {
    width: 100% !important;
  }
  .mobile-hide {
    display: none !important;
  }
}

Largura Maxima​

  • Container principal: 600px
  • Imagens: 100% do container
  • Texto: padding lateral de 20px

Preview e Teste​

Preview Visual​

  1. Clique em Preview
  2. Alterne entre Desktop e Mobile
  3. Veja como ficara para o usuario

Dados de Preview​

Configure dados de teste para ver variaveis:

{
  "contact": {
    "firstName": "Maria",
    "lastName": "Silva",
    "email": "maria@exemplo.com"
  },
  "event": {
    "orderId": "12345",
    "total": 299.90
  }
}

Enviar Teste​

  1. Clique em Enviar Teste
  2. Digite seu email
  3. Receba o email real
  4. Verifique em diferentes clientes

Salvando o Template​

  1. Revise todas as configuracoes
  2. Verifique o preview
  3. Clique em Salvar

O template estara disponivel para uso em campanhas e jornadas.

Editando Templates​

Templates em Uso​

Templates usados em campanhas ativas podem ser editados:

  • Alteracoes afetam proximos envios
  • Envios ja realizados nao sao afetados
  • Considere duplicar para manter historico

Versionamento​

Para manter historico de versoes:

  1. Duplique o template
  2. Adicione versao ao nome (v1, v2, etc.)
  3. Arquive versoes antigas

Checklist de Qualidade​

Antes de usar um template em producao:

  • Assunto claro e sem erros
  • Todas as variaveis existem e funcionam
  • Links funcionando corretamente
  • Imagens com alt text
  • Visualizacao OK em mobile
  • Visualizacao OK em desktop
  • Teste enviado e verificado
  • Link de descadastro presente
  • Remetente correto selecionado

Exemplos de Templates​

Boas-Vindas​

Assunto: Bem-vindo ao NotifyChain, {{contact.firstName}}!

Ola {{contact.firstName}},

Estamos muito felizes em ter voce conosco!

Aqui estao os proximos passos:
1. Complete seu perfil
2. Configure seu primeiro evento
3. Crie sua primeira campanha

[Comecar Agora]

Precisa de ajuda? Responda este email.

Equipe NotifyChain

Promocao​

Assunto: {{contact.firstName}}, 30% OFF so hoje!

Oferta exclusiva para voce!

Use o cupom PROMO30 e ganhe 30% de desconto
em qualquer produto.

Valido ate meia-noite de hoje.

[Ver Produtos]

*Oferta valida para primeira compra.

Transacional​

Assunto: Pedido #{{event.orderId}} confirmado!

Ola {{contact.firstName}},

Recebemos seu pedido!

Numero: #{{event.orderId}}
Total: {{formatCurrency event.total "BRL"}}
Previsao de entrega: {{formatDate event.deliveryDate "dd/MM/yyyy"}}

[Acompanhar Pedido]

Obrigado pela compra!