Dynamiske skabeloner

Hvorfor vi har brug for dynamiske skabeloner

Dette afsnit vil introducere dig til EUmails skabelonlogik, som du kan bruge både med EUmails indbyggede skabeloneditor og med dine HTML-skabeloner. Hovedidéen er, at du har en skabelon med dit e-mail-design, og inden for den skabelon kan du placere nogle erstatningskoder, som EUmail kan erstatte med de merge-data, du leverer.

Du leverer denne information fra dit system, når du kalder EUmail API’en, og EUmail vil flette den ind i din skabelon, før e-mailen sendes. Til udviklingsformål kan du også definere merge-data inden for editoren.

EUmail implementerer et modificeret sæt af “instruktioner” baseret på Handlebars-biblioteket.

Med dette mener vi, at de fleste af de instruktioner, der er defineret i Handlebars-biblioteket, vil fungere som i andre applikationer, der bruger det samme bibliotek, mens vi har valgt at forbedre andre i EUmail.

Normalt betyder dette, at standard Handlebar-instruktionen vil fungere, men vi har også tilføjet en forbedret version.

Hvordan det virker

Du vil have brug for to ting for at bruge EUmail til produktionsformål:

• En skabelon med dit e-mail-design
• Merge-data i JSON-format

Skabelonen kan befinde sig i EUmail, eller du kan levere den i kaldet til EUmail API’en. JSON merge-dataene er valgfrie, men de fleste transaktionelle e-mails har en slags variable felter, så det giver sjældent mening at sende en transaktionel e-mail uden nogle merge-data som et navn, brugernavn eller e-mail.

merge data + skabelon = endelig e-mail

Eksempel på nogle merge-data i JSON-format:

{

	"mergedata": 

	{

		"vehicle_variant": "Convertible",

		"is_fourwheel": true

	}

}

Eksempel på en skabelon med ovenstående felter

<table>

  <thead>

    <th>Parameter</th>

    <th>Value</th>

  </thead>

  <tr>

    <td>Variant:</td>

    <td>{{vehicle_variant}}</td>

  </tr>

  <tr>

    <td>Four wheel drive:</td>

    <td>{{#if is_fourwheel}}YES {{else}}NO {{/if}}</td>

  </tr>

</table>

Resultat HTML:

Variabel erstatning

Simple erstatning er den mest basale form for erstatning - eller brugen af variabler.

Eksempel skabelon:

Hello {{firstname}}

Eksempel data:

{

	"firstname":"Jane Doe"

}

Resultat output:

Hello Jane Doe

Udsagn

IF-betingelse

IF-udsagnet er et grundlæggende koncept i programmering og er meget brugt. Det gør det muligt for dig at træffe beslutninger og kontrollere flowet af din kode baseret på bestemte betingelser. Ved at evaluere en specifik betingelse bestemmer IF-udsagnet, om der skal udføres en kodeblok eller ej. Hvis betingelsen er sand, udføres koden inden for IF-udsagnet; ellers springes den over. Dette gør det muligt for dig at oprette dynamiske og responsive webskabeloner, der viser indhold eller udfører handlinger baseret på specifikke kriterier eller brugerinput.

####### Simpelt IF-udsagn

{{#if is_raining}}

Show this paragraph when variable 'is_raining' is true

{{/if}}

IF-udsagn - sammenligning

{{#if weather=="raining"}}

Show this paragraph if variable "weather" equals "raining"

{{/if}}

IF - ELSE udsagn

{{#if weather=="raining"}}

Show this paragraph if variable "weather" equals "raining"

{{else}}

Show this if variable "weather" is not "raining"

{{/if}}

UNLESS Betingelser

UNLESS-udsagnet er en betinget konstruktion, der gør det muligt for dig at udføre en kodeblok kun, hvis en specifik betingelse er falsk. Det giver en alternativ måde at håndtere situationer, hvor du vil udføre en handling eller vise indhold, når en betingelse ikke er opfyldt. Det er som at sige “gør dette, medmindre denne betingelse er sand.” “unless”-udsagnet tilbyder fleksibilitet i at kontrollere flowet af din skabelon baseret på negationen af en betingelse.

{{#unless is_raining}}

Show this paragraph when 'is_raining' is false

{{/unless}}

EACH løkke

EACH-udsagnet er en konstruktion, der gør det muligt for dig at iterere over en samling eller array af data og generere dynamisk indhold baseret på hvert element i samlingen. Det giver en måde at løbe gennem elementer og gentage en kodeblok for hvert element i samlingen. Dette er særligt nyttigt til at generere lister, tabeller eller andre gentagne strukturer i dit HTML-output. EACH-udsagnet forenkler processen med at vise flere elementer ved automatisk at håndtere iterationslogikken for dig.

Skabelon

<ul>

{{#each cheeses}}

<li>{{this}}</li>

{{/each}}

</ul>

Merge data

{

"cheeses":["Havarti","Emmentaler"]

}

Output

<ul>

    <li>Havarti</li>

    <li>Emmentaler</li>

</ul>

Du kan bruge den valgfrie else-tag til at håndtere situationen, hvor der ikke er nogen elementer på listen.

{{#each sections}}

<p>{{this}}</p>

{{else}}

<p>The sections list is empty</p>

{{/each}}

Booleske operatorer

Booleske operatorer bruges i kombination med andre udsagn - ofte IF eller UNLESS udsagn.

Booleske operatorer bruges i programmering og logik til at kombinere eller modificere betingelser. De hjælper med at evaluere sandheden eller falskhed af udtryk og træffe beslutninger baseret på dem. De to booleske operatorer understøttet af EUmail er “AND” og “OR”.

Booleske operatorer bruges til at oprette komplekse betingelser og kontrollere flowet af kodeudførelse i programmering. De gør det muligt for dig at træffe beslutninger baseret på den kombinerede sandhed eller falskhed af flere betingelser.

OR operator

OR-logikoperatoren gør det muligt for dig at kombinere flere betingelser og evaluerer til sand, hvis mindst én af betingelserne er sand. Med andre ord giver den et “enten/eller” scenarie.

Lad os overveje et simpelt eksempel:

1. Betingelse 1: Det regner udenfor.
2. Betingelse 2: Det er solskin udenfor.

Ved at bruge OR-operatoren kan vi oprette følgende logiske udsagn:

Betingelse 1 OR Betingelse 2

Hvis enten Betingelse 1 (regner) eller Betingelse 2 (solskin) er sand, vil hele udsagnet evaluere til sandt. Det betyder, at så længe én af betingelserne er opfyldt, vil det samlede resultat være sandt.

For eksempel:

• Hvis det regner udenfor (Betingelse 1 er sand), evaluerer udsagnet til sandt.
• Hvis det er solskin udenfor (Betingelse 2 er sand), evaluerer udsagnet til sandt.
• Hvis det både regner og er solskin udenfor, evaluerer udsagnet stadig til sandt, fordi mindst én af betingelserne er sand.

OR-operatoren er nyttig, når du vil udføre en handling eller træffe en beslutning baseret på flere muligheder, og du kun behøver, at én af disse muligheder er sand.

Med OR-operatoren kan du evaluere et udsagn med to (og kun to) parametre. Hvis en af de to operatorer er sand, er udsagnet selv sandt.

Eksempel 1

{{#if (OR is_raining is_sunny)}}

Display this if the variable 'is_raining' or the variable 'is_sunny' are true

{{/if}}

Eksempel 2

{{#if (OR weather=="raining" weather="sunny")}}

Display this if the variable weather is "raining" or "sunny".

{{/if}}

AND operator

AND-logikoperatoren gør det muligt for dig at kombinere flere betingelser og evaluerer til sand kun, hvis alle betingelserne er sande. Den giver et “både/og” scenarie.

Lad os overveje et simpelt eksempel:

1. Betingelse 1: Det regner udenfor.
2. Betingelse 2: Jeg har en paraply.

Ved at bruge AND-operatoren kan vi oprette følgende logiske udsagn:

Betingelse 1 AND Betingelse 2

For at hele udsagnet skal evaluere til sandt, skal både Betingelse 1 (regner) og Betingelse 2 (have en paraply) være sande. Hvis en af betingelserne er falsk, vil det samlede resultat være falsk.

For eksempel:

Hvis det regner udenfor (Betingelse 1 er sand) og du har en paraply (Betingelse 2 er sand), evaluerer udsagnet til sandt.

Hvis det ikke regner udenfor (Betingelse 1 er falsk), uanset om du har en paraply eller ej, evaluerer udsagnet til falsk.

Hvis det regner, men du ikke har en paraply (Betingelse 2 er falsk), evaluerer udsagnet også til falsk. AND-operatoren er nyttig, når du vil sikre dig, at alle angivne betingelser er opfyldt, før du udfører en handling eller træffer en beslutning. Den kræver, at alle betingelser er sande, for at det samlede resultat er sandt.

Eksempel 1

{{#if (AND is_raining has_umbrella)}}

Display this if the variable 'is_raining' AND the variable 'has_umbrella' are both true

{{/if}}

Eksempel 2

{{#if (AND weather=="raining" equipment="umbrella")}}

Display this if the value of variable "weather" is "raining" 

and the value of the variable "equipment" is "umbrella". 

{{/if}}

Indlejrede OR og AND operatorer

AND og OR operatorerne kan kun tage to argumenter hver. Hvis du har brug for flere argumenter, skal du bruge “indlejrede” operatorer.

Indlejrede operatorer gør det muligt for dig at kombinere flere betingelser sammen for at træffe beslutninger. Du kan bruge “AND” til at kræve, at flere betingelser er sande, og “OR” til at overveje, at mindst én betingelse er sand. Ved at indlejre disse operatorer kan du oprette komplekse betingelser, der overvejer forskellige kombinationer af udsagn.

Eksempel på indlejret OR

{{#if (OR is_raining (OR is_snowing is_thunder)}}

Display this if the value of "is_raining", "is_showing" or "is_thunder" are true.

{{/if}}

Eksempel på indlejret AND

{{#if (AND is_raining (AND is_snowing is_thunder)}}

Display this if the value of all three variables "is_raining", 

"is_showing" and "is_thunder" are true.

{{/if}}

Kombination af operatorer

Når du bruger logiske operatorer som OR og AND i kombination, skal der bruges parenteser til at gruppere betingelser og kontrollere rækkefølgen af evaluering. Ved at bruge parenteser kan du oprette mere komplekse og præcise logiske udtryk. For eksempel kan du prioritere visse betingelser frem for andre eller specificere forholdet mellem forskellige grupper af betingelser. Det sikrer, at de logiske operationer udføres i den tilsigtede rækkefølge og hjælper med at tydeliggøre logikken i dine udsagn.

{{#if (OR (AND is_raining has_umbrella) (AND is_snowing has_wintercoat))}}

Vis dette, hvis det er sikkert at gå ud. 

Dette fordi det regner, men du har en paraply, eller det sner, 

men du har en vinterjakke.

{{/if}}

HTML Escaping

HTML escaping i webskabeloner er en teknik, der bruges til at sikre, at brugerinput eller dynamiske data vises som tilsigtet uden at forårsage problemer eller sikkerhedssårbarheder. Det involverer konvertering af specielle tegn i dataene til deres tilsvarende HTML-entiteter, hvilket forhindrer dem i at blive fortolket som kode og potentielt forstyrre strukturen eller funktionaliteten af websiden.

Brug triple handlebars til at escape parsing af merge-data. Du kan bruge dette til at inkludere enhver HTML uden at den bliver fortolket.

{{{body}}}