5 Recursos Que Fazem do Blocks a Ferramenta Perfeita para Criar Modelos de E-mail para o SendGrid
Ainda tem dificuldade para criar modelos impecáveis de e-mail para o SendGrid usando o mínimo de recursos possível? Então o Blocks é a solução perfeita para você. Nosso editor de e-mail sem código, de arrastar e soltar, ajuda você a produzir e-mails rapidamente sem perder qualidade. Aqui estão 5 recursos do Blocks que comprovam isso. A seguir, você vai ver por que nossos modelos de e-mail para o SendGrid são um ótimo ponto de partida.
1. Escolha Entre Código e Sem Código
O Blocks é um editor de e-mail sem código, o que significa que você pode dominá-lo sem nenhuma habilidade de programação. Para criar um modelo impecável de e-mail para o SendGrid, use um modelo pronto ou monte o seu usando estruturas e elementos: o Blocks escreve o código por conta própria.
Não se preocupe com a qualidade do código, não vai haver trechos estranhos nem elementos desnecessários nele. Nossos modelos de e-mail para o SendGrid são totalmente compatíveis com qualquer plataforma que suporte HTML.
Porém, se você quiser editar o código você mesmo, fique à vontade. Basta abrir a seção Código e pronto.
2. Estruturas e Elementos Prontos
Para estilizar o modelo de e-mail pronto conforme sua necessidade ou para montar seu próprio modelo de e-mail para o SendGrid, use estruturas e elementos prontos. Você vai encontrar todos os componentes que precisa para um modelo perfeito de e-mail para o SendGrid: cabeçalhos, rodapés, botões, elementos de texto, imagens e muito mais.
Arraste os elementos para mudar a posição deles no e-mail e estilize-os como quiser.
3. Todos os Projetos em um Só Lugar
É um recurso matador para quem está cansado de perder tempo e energia procurando todos os materiais necessários de um projeto. O Blocks permite guardar seus projetos em nossos servidores seguros: divida tudo em pastas para navegar melhor, mova modelos de e-mail de uma pasta para outra e muito mais.
4. Modelos de E-mail para o SendGrid Compatíveis com Celular
Se você escolher criar seu modelo de e-mail para o SendGrid no Blocks, pode ter certeza de que seus e-mails vão ficar igualmente bonitos em qualquer dispositivo, seja celular, tablet ou computador. O Blocks também tem uma função de pré-visualização que mostra como seu e-mail vai aparecer nas versões mobile e desktop:
5. Elementos Dinâmicos para Seus Modelos de E-mail no SendGrid
Quer personalizar seus modelos de e-mail para o SendGrid com elementos dinâmicos? Sem problema! O Blocks permite adicionar elementos dinâmicos ao modelo e ajustá-los conforme sua necessidade. Acompanhe as tendências e use elementos dinâmicos nos seus modelos de e-mail para o SendGrid com o Blocks!
Como Transformar um Modelo do Blocks em um Dynamic Template do SendGrid
O SendGrid guarda designs transacionais como modelos dinâmicos e os preenche com os dados da sua requisição à API. O Blocks não tem exportação direta para o SendGrid, então você mesmo copia o HTML do seu e-mail e o cola no modelo.
Onde Colocar o Modelo
No SendGrid, abra Email API > Dynamic Templates, crie um modelo e clique em Add Version. Escolha um design inicial, selecione o Code Editor e cole nele o HTML exportado. O seu código vai se referir ao modelo pelo ID, que começa com d-. O passo a passo completo está no guia do SendGrid sobre modelos dinâmicos.
Quais Variáveis Usar
Os modelos dinâmicos são escritos em Handlebars: substitua o texto de exemplo por {{first_name}}, repita linhas da tabela com {{#each}} e coloque {{subject}} na linha de assunto da versão. Onde um valor puder conter aspas ou um e comercial, use chaves triplas, como em {{{subject}}}.
<p>Hi {{first_name}},</p>
<table>
{{#each items}}
<tr><td>{{this.name}}</td><td>{{this.price}}</td></tr>
{{/each}}
</table>Em seguida, o seu app envia o ID do modelo junto com os dados para os placeholders dele, aqui com a biblioteca oficial para Node.js:
const sgMail = require('@sendgrid/mail');
sgMail.setApiKey(process.env.SENDGRID_API_KEY);
sgMail.send({
to: 'customer@example.com',
from: 'shop@example.com', // a verified sender
templateId: process.env.SENDGRID_TEMPLATE_ID, // d-...
dynamicTemplateData: {
subject: 'Your order has shipped',
first_name: 'Anna',
items: [{ name: 'T-shirt', price: '$20' }],
},
});Como Testar o E-mail
Antes do primeiro envio, clique em Preview no editor, abra Show Test Data e cole um exemplo em JSON com as mesmas chaves usadas no seu código. Verifique se todos os placeholders foram preenchidos: o SendGrid suporta a maioria dos recursos do Handlebars, mas não todos, e vale a pena testar as condições com dados de exemplo. Depois de um envio real, o feed Activity mostra o que aconteceu com cada mensagem.
Palavras Finais
Acelerar a produção de e-mails e reduzir seu custo é a nossa nova realidade. Se você quer ficar à frente dos concorrentes, comece a usar o Blocks, um editor de e-mail sem código, de arrastar e soltar. Vai ser um divisor de águas.