5 Funktionen, die Blocks zum perfekten Tool für SendGrid-E-Mail-Vorlagen machen
Tun Sie sich noch schwer damit, makellose SendGrid-E-Mail-Vorlagen mit möglichst wenig Aufwand zu erstellen? Dann ist Blocks die perfekte Lösung für Sie. Unser No-Code-Drag-and-drop-E-Mail-Editor hilft Ihnen, E-Mails schnell und ohne Qualitätsverlust zu produzieren. Hier sind 5 Funktionen von Blocks, die das beweisen. Im Folgenden sehen Sie, warum unsere E-Mail-Vorlagen für SendGrid ein kluger Ausgangspunkt sind.
1. Wählen Sie zwischen Code und No-code
Blocks ist ein No-Code-E-Mail-Editor, den Sie ohne jegliche Programmierkenntnisse beherrschen. Um eine makellose SendGrid-E-Mail-Vorlage zu erstellen, nutzen Sie eine fertige E-Mail-Vorlage oder bauen Sie Ihre eigene aus Strukturen und Elementen zusammen: Blocks schreibt den Code für Sie.
Machen Sie sich keine Sorgen um die Qualität des Codes – es gibt keine merkwürdigen Fragmente oder überflüssigen Elemente darin. Unsere SendGrid-E-Mail-Vorlagen sind mit jeder Plattform, die HTML unterstützt, vollständig kompatibel.
Wenn Sie den Code jedoch lieber selbst bearbeiten möchten, sind Sie herzlich dazu eingeladen. Öffnen Sie einfach den Bereich „Code“, und schon kann es losgehen.
2. Fertige Strukturen und Elemente
Um die fertige E-Mail-Vorlage nach Ihren Wünschen zu gestalten oder eine eigene SendGrid-E-Mail-Vorlage zu erstellen, nutzen Sie fertige Strukturen und Elemente. Sie finden alle Bausteine einer perfekten SendGrid-E-Mail-Vorlage: Header, Footer, Buttons, Textelemente, Bilder und vieles mehr.
Ziehen Sie die Elemente per Drag-and-drop, um ihre Position in der E-Mail zu ändern, und gestalten Sie sie ganz nach Ihren Wünschen.
3. Alle Projekte an einem Ort
Das ist eine unschlagbare Funktion für alle, die es leid sind, Zeit und Energie mit der Suche nach Projektmaterialien zu verschwenden. Mit Blocks speichern Sie Ihre Projekte auf unseren sicheren Servern: Teilen Sie alles in Ordner ein, um leichter zu navigieren, verschieben Sie E-Mail-Vorlagen zwischen Ordnern und vieles mehr.
4. Mobilfreundliche SendGrid-E-Mail-Vorlagen
Wenn Sie Ihre SendGrid-E-Mail-Vorlage in Blocks erstellen, können Sie sicher sein, dass Ihre E-Mails auf jedem Gerät gleich gut aussehen – ob Smartphone, Tablet oder Computer. Blocks bietet außerdem eine Vorschaufunktion, die zeigt, wie Ihre E-Mail in der mobilen und der Desktop-Version dargestellt wird:
5. Dynamische Elemente für Ihre SendGrid-E-Mail-Vorlagen
Möchten Sie Ihre SendGrid-E-Mail-Vorlagen mit dynamischen Elementen personalisieren? Kein Problem! Mit Blocks fügen Sie der Vorlage dynamische Elemente hinzu und passen sie ganz nach Bedarf an. Bleiben Sie am Puls der Zeit und nutzen Sie dynamische Elemente in Ihren SendGrid-E-Mail-Vorlagen mit Blocks!
So machen Sie aus einer Blocks-Vorlage eine dynamische Vorlage in SendGrid
SendGrid verwaltet Designs für Transaktions-E-Mails als dynamische Vorlagen und befüllt sie mit den Daten aus Ihrer API-Anfrage. Blocks bietet keinen direkten Export zu SendGrid, daher kopieren Sie das HTML Ihrer E-Mail und fügen es selbst in die Vorlage ein.
Wohin die Vorlage gehört
Öffnen Sie in SendGrid Email API > Dynamic Templates, legen Sie eine Vorlage an und klicken Sie auf Add Version. Wählen Sie ein Ausgangsdesign, entscheiden Sie sich für den Code Editor und fügen Sie das exportierte HTML dort ein. Ihr Code verweist auf die Vorlage über deren ID, die mit d- beginnt. Die vollständige Anleitung finden Sie im SendGrid-Leitfaden zu dynamischen Vorlagen.
Welche Variablen Sie verwenden
Dynamische Vorlagen werden in Handlebars geschrieben: Ersetzen Sie den Beispieltext durch {{first_name}}, wiederholen Sie Tabellenzeilen mit {{#each}} und setzen Sie {{subject}} in die Betreffzeile der Version. Kann ein Wert Anführungszeichen oder ein kaufmännisches Und enthalten, verwenden Sie dreifache geschweifte Klammern, etwa {{{subject}}}.
<p>Hi {{first_name}},</p>
<table>
{{#each items}}
<tr><td>{{this.name}}</td><td>{{this.price}}</td></tr>
{{/each}}
</table>
Ihre App sendet dann die Vorlagen-ID zusammen mit den Daten für die Platzhalter, hier mit der offiziellen Node.js-Bibliothek:
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' }],
},
});
So testen Sie die E-Mail
Klicken Sie vor dem ersten Versand im Editor auf Preview, öffnen Sie Show Test Data und fügen Sie ein JSON-Beispiel mit denselben Schlüsseln wie in Ihrem Code ein. Prüfen Sie, ob jeder Platzhalter befüllt ist: SendGrid unterstützt die meisten, aber nicht alle Funktionen von Handlebars, und Bedingungen sollten Sie mit Beispieldaten testen. Nach einem echten Versand zeigt der Feed Activity, was mit jeder Nachricht passiert ist.
Fazit
Schnellere E-Mail-Produktion bei geringeren Kosten ist heute Realität. Wenn Sie Ihrer Konkurrenz einen Schritt voraus sein wollen, nutzen Sie Blocks, den No-Code-Drag-and-drop-E-Mail-Editor. Er wird alles verändern.
