Este artigo explica como utilizar o editor HTML para enviar notificações com um banner personalizado para cada cliente, usando dados e características armazenadas na ficha do usuário como variáveis.

• Nível de Acesso: Administrador, Editor.
  Persona: Analista de CRM, Analista de Marketing, Gerente de E-commerce.

1: Hospede as imagens

Para começar, suas imagens precisam estar hospedadas em um diretório público. Você pode hospedá-las no editor visual da Dito, conforme o exemplo abaixo.

Repare que foram carregadas 3 imagens: STO, RFM e AGENDA. O nome de cada arquivo é acompanhado da sua extensão: STO.png, RFM.png e AGENDA.png.

2. Crie e importe o Custom Data

Importe uma base na plataforma da Dito, criando um Custom Data para os usuários que receberão essa notificação.Caso precise de ajuda no processo de importação, acesse este artigo aqui.

O custom data deve ter um nome (cabeçalho da coluna), e os valores devem ser preenchidos com o nome da imagem que os usuários devem receber (sem a extensão do arquivo).

Se você tiver dúvidas de como criar um custom data, consulte este artigo.

3. Construa a URL da imagem com a variável

Crie uma variável no link da imagem que fará parte da notificação. Se suas imagens estiverem em um diretório público, copie o link do seu arquivo. Caso suas imagens estejam hospedadas na Dito, esse link estará disponível no editor visual após você selecionar a imagem.

Os links possuem o mesmo endereçamento, mudando apenas o final onde contém o nome do arquivo, como no exemplo:

https://.../graphapiv2/STO.png

https://.../graphapiv2/RFM.png

https://.../graphapiv2/AGENDA.png

A variável deve ser inserida no final do link, exatamente onde o nome das imagens muda, antes da extensão:

https://.../graphapiv2/*|DATA_PRODUTO|*.png

O formato da variável é *|DATA_NOMECARACTERISTICA|*, levando em consideração que “NOMECARACTERISTICA” deve ser substituído pelo nome do custom data que você criou.

4. Insira a imagem dinâmica no editor HTML

Acesse o editor HTML e insira um bloco de imagem. No campo de URL da imagem, cole o link construído com a variável.

Você poderá enviar um teste para seu endereço de e-mail se tiver o custom data criado em sua própria ficha de usuário. Prontinho, agora você tem uma notificação com imagem customizada!

Não esqueça de ler e aplicar as boas práticas na construção de HTMLs para e-mail.

FAQ – Perguntas Frequentes

1. Pergunta: Preciso hospedar as imagens obrigatoriamente na Dito?
Resposta: Não. Você pode usar qualquer diretório público, desde que a URL base seja a mesma para todas as imagens e apenas o final (nome do arquivo) mude para corresponder ao valor do custom data.

2. Pergunta: O nome do arquivo da imagem precisa ser exatamente igual ao valor no custom data?
Resposta: Sim. A variável *|DATA_NOMECARACTERISTICA|* irá puxar o valor exato do campo. Se o valor for "PROMO10", o nome do arquivo na URL final será "PROMO10.png" (considerando a extensão .png no link).

3. Pergunta: Posso usar essa técnica para personalizar outras coisas além de banners?
Resposta: Sim. A mesma lógica pode ser aplicada para personalizar links de destino (URLs em botões) ou qualquer outro atributo HTML que possa ser construído dinamicamente a partir de um custom data.

Ficou com alguma dúvida ou identificou algum problema? Acione nosso time pelo chat disponível no app dito. (Horário de Atendimento de Segunda a Sexta das 9hrs as 18hrs)