5 funciones que convierten a Blocks en la herramienta perfecta para crear plantillas de email de SendGrid
¿Sigues teniendo problemas para crear plantillas de email de SendGrid impecables usando el mínimo de recursos posible? Entonces Blocks es la solución perfecta para ti. Nuestro editor de emails de arrastrar y soltar sin código te ayudará a producir emails rápido sin perder calidad. Aquí tienes 5 funciones de Blocks que lo demuestran. A continuación verás por qué nuestras plantillas de email para SendGrid son un buen punto de partida.
1. Elige entre código y sin código
Blocks es un editor de emails sin código, lo que significa que puedes dominarlo sin ningún conocimiento de programación. Para crear una plantilla de email de SendGrid impecable, usa una plantilla de email ya hecha o crea la tuya con estructuras y elementos: Blocks escribirá el código por ti.
No te preocupes por la calidad del código: no habrá fragmentos extraños ni elementos innecesarios. Nuestras plantillas de email para SendGrid son totalmente compatibles con cualquier plataforma que admita HTML.
Sin embargo, si prefieres editar el código tú mismo, adelante. Solo tienes que abrir la sección Código y ya está todo listo.
2. Estructuras y elementos prediseñados
Para adaptar a tu gusto la plantilla de email lista para usar o crear tu propia plantilla de email de SendGrid, usa estructuras y elementos prediseñados. Encontrarás todos los componentes que necesitas para una plantilla de email de SendGrid perfecta: cabeceras, pies de página, botones, elementos de texto, imágenes, etc.
Arrastra los elementos para cambiar su posición en el email y dales el estilo que quieras.
3. Todos tus proyectos en un solo lugar
Es una función estrella para quienes están cansados de perder tiempo y energía buscando todos los materiales necesarios de un proyecto. Blocks te permite guardar tus proyectos en nuestros servidores seguros: divide todo en carpetas para navegar mejor, mueve plantillas de email de una carpeta a otra y mucho más.
4. Plantillas de email de SendGrid adaptadas a móviles
Si eliges crear tu plantilla de email de SendGrid en Blocks, puedes estar seguro de que tus emails se verán igual de bonitos en cualquier dispositivo, ya sea un móvil, una tablet o un ordenador. Blocks también tiene una función de vista previa que muestra cómo se verá tu email en las versiones de móvil y escritorio:
5. Elementos dinámicos para tus plantillas de email de SendGrid
¿Quieres personalizar tus plantillas de email de SendGrid con elementos dinámicos? ¡No hay problema! Blocks te permite añadir elementos dinámicos a la plantilla y adaptarlos a tus necesidades. ¡Mantente al día y usa elementos dinámicos en tus plantillas de email de SendGrid con Blocks!
Cómo convertir una plantilla de Blocks en una Dynamic Template de SendGrid
SendGrid guarda los diseños transaccionales como plantillas dinámicas y los rellena con los datos de tu solicitud a la API. Blocks no tiene exportación directa a SendGrid, así que copias el HTML de tu email y lo pegas tú mismo en la plantilla.
Dónde colocar la plantilla
En SendGrid, abre Email API > Dynamic Templates, crea una plantilla y haz clic en Add Version. Elige un diseño de partida, selecciona el Code Editor y pega en él el HTML exportado. Tu código hará referencia a la plantilla por su ID, que empieza por d-. Tienes el proceso completo en la guía de SendGrid sobre plantillas dinámicas.
Qué variables usar
Las plantillas dinámicas se escriben en Handlebars: sustituye el texto de ejemplo por {{first_name}}, repite filas de tabla con {{#each}} y pon {{subject}} en la línea de asunto de la versión. Cuando un valor pueda contener comillas o un ampersand, usa triples llaves, como en {{{subject}}}.
<p>Hi {{first_name}},</p>
<table>
{{#each items}}
<tr><td>{{this.name}}</td><td>{{this.price}}</td></tr>
{{/each}}
</table>Después, tu app envía el ID de la plantilla junto con los datos para sus marcadores; aquí, con la biblioteca oficial de 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' }],
},
});Cómo probar el email
Antes del primer envío, haz clic en Preview en el editor, abre Show Test Data y pega una muestra JSON con las mismas claves que en tu código. Comprueba que todos los marcadores se rellenan: SendGrid admite la mayoría de las funciones de Handlebars, pero no todas, y conviene probar las condiciones con datos de ejemplo. Tras un envío real, el registro Activity muestra qué ha pasado con cada mensaje.
Para terminar
Acelerar la producción de emails y reducir su coste es nuestra nueva realidad. Si quieres ir por delante de tu competencia, empieza a usar Blocks, un editor de emails de arrastrar y soltar sin código. Será un antes y un después.