Learning Objectives / Objectifs de formation
After completing this unit, you’ll be able to: / Après avoir terminé cette unité, vous pourrez:
- Introduce the fundamentals and syntax for Guide Template Language (GTL). / Présentez les principes fondamentaux et la syntaxe du Guide Template Language (GTL).
- Create data-driven message templates using data sources, templates, and tags. / Créez des modèles de messages basés sur les données à l’aide de sources de données, de modèles et de balises.
- Work with GTL examples and best practices. / Travaillez avec des exemples et des meilleures pratiques GTL.
Guide Template Language is Marketing Cloud’s newest programmatic language, and it’s customized to work within messages to provide personalized content. / Guide Template Language est le langage de programmation le plus récent de Marketing Cloud, et il est personnalisé pour fonctionner dans les messages afin de fournir un contenu personnalisé.
GTL takes data from specified data sources and applies it within templates used to render the content. / GTL prend les données des sources de données spécifiées et les applique dans les modèles utilisés pour rendre le contenu.
Those templates contain tags that determine where to insert data. / Ces modèles contiennent des balises qui déterminent où insérer les données.
If you’ve used templating libraries like Mustatche.js or Handlebars.js, GTL will look familiar. / Si vous avez utilisé des bibliothèques de modèles comme Mustatche.js ou Handlebars.js, GTL vous semblera familier.
In fact, GTL supports templates from those sources, but Marketing Cloud provides the data instead of scripts. / En fait, GTL prend en charge les modèles de ces sources, mais Marketing Cloud fournit les données au lieu des scripts.
GTL Syntax / Syntaxe GTL
Let’s get started by looking at some tags. / Commençons par regarder quelques balises.
Some of the tags are so simple that we just call them simple tags. / Certaines balises sont si simples que nous les appelons simplement de simples balises.
Want to include someone’s first name in an email? Use this tag. / Vous souhaitez inclure le prénom de quelqu’un dans un e-mail? Utilisez cette balise.
{{FirstName}}
You can also add prefixes and suffixes to a tag to identify what kind of tag you’re putting in a template. / Vous pouvez également ajouter des préfixes et des suffixes à une balise pour identifier le type de balise que vous mettez dans un modèle.
Prefixes include these characters. / Les préfixes incluent ces caractères.
| Tag Type | Prefix Symbol |
| Section Tag | # |
| Function or Set Delimiter Tag | = |
| Inverted Section Tag | ^ |
| Comment Tag | ! |
| Partial Tag | > |
| Block Helper | #= |
| Data | { |
Suffixes include these characters. / Les suffixes incluent ces caractères.
| Tag Type | Suffix Symbol |
| Close Data Tag | } |
| Close Set Delimiter Tag | = |
You can also create block tags in GTL. / Vous pouvez également créer des balises de bloc dans GTL.
This example shows a block tag nested inside another block tag, along with some examples of simple tags that bring data in from a data extension containing product information. / Cet exemple montre une étiquette de bloc imbriquée dans une autre étiquette de bloc, ainsi que quelques exemples de balises simples qui importent des données d’une extension de données contenant des informations sur le produit.
{{#Products}}
<strong>Product Name:</strong> {{Product_Name}}<br />
<strong>SKU:</strong>{{sku}}<br />
<img src="{{Thumbnail_URL}}" /><br />
{{#Product_Ratings}}
<strong>Most Recent Review: </strong>{{Last_Review_Text}}<br />
<strong># of Ratings: </strong>{{Number_of_Ratings}}<br />
<strong>Ave Rating: </strong>{{Average_Rating}}<br /><br /><br />
{{/Product_Ratings}}
{{/Products}}
Notice how the hashtags at the beginning of the block tags indicate section tags. / Remarquez comment les hashtags au début des balises de bloc indiquent les balises de section.
Use block tags to create and use data sources, access helper functions, and provide template logic. / Utilisez des balises de bloc pour créer et utiliser des sources de données, accéder aux fonctions d’assistance et fournir une logique de modèle.
Speaking of helper functions, GTL handles common functions like Each, If, Switch, Unless, and With. / En parlant de fonctions d’assistance, GTL gère des fonctions courantes telles que Each, If, Switch, Unless et With.
For example, this If function provides text about whether an order is ready or not. / Par exemple, cette fonction If fournit un texte indiquant si une commande est prête ou non.
{{#if order=="1234"}}Your order is ready{{.else}}Your order is not ready{{/if}}
Blocks and Slots /Blocs et emplacements
GTL templates use blocks and slots to organize data for messages. / Les modèles GTL utilisent des blocs et des emplacements pour organiser les données des messages.
This example shows a sample HTML email message. / Cet exemple montre un exemple de message électronique HTML.
<html>
<body>
<style type="text/css">
.tftable {font-size:12px;color:#333333;width:100%;border-width: 1px;border-color: #ebab3a;border-collapse: collapse;}
.tftable th {font-size:12px;background-color:#e6983b;border-width: 1px;padding: 8px;border-style: solid;border-color: #ebab3a;text-align:left;}
.tftable tr {background-color:#ffffff;}
.tftable td {font-size:12px;border-width: 1px;padding: 8px;border-style: solid;border-color: #ebab3a;}
</style>
<table class="tftable" border="1">
<tr>
<th colspan="2">TITLE OF MESSAGE</th>
</tr>
<tr>
<td rowspan="3">
{{.slot slot1}}
{{.block mytext+imageblock textimage}}Block Goes Here
<br />
{{.default}}I am a Text and Image Block - Hello World!{{/default}}
{{/block}}
{{/slot}}
</td>
<td>
{{.slot slot2}}
{{.default}}This slot is available for anything{{/default}}
{{/slot}}
</td>
</tr>
<tr>
<td>
{{.slot slot3}}
{{.block mytextblock text}}Block Goes Here
<br />
{{.default}}I am a Text only Block - Hello World!{{/default}}
{{/block}}
{{/slot}}
</td>
</tr>
<tr>
<td>
{{.slot slot4}}
{{.block myimageblock image}}Block Goes Here
<br />
{{.default}}I am an Image only Block - Hello World!{{/default}}
{{/block}}
{{/slot}}
</td>
</tr>
</table>
</body>
</html>
The rendered template looks like this. / Le modèle rendu ressemble à ceci.
Blocks and slots can contain meta information, default content, and content to render. / Les blocs et les emplacements peuvent contenir des méta-informations, du contenu par défaut et du contenu à restituer.
Blocks also contain JSON objects used to provide data during rendering. / Les blocs contiennent également des objets JSON utilisés pour fournir des données lors du rendu.
Dataobject and Datasource
All the data you’re pulling into you template has to come from somewhere, right? / Toutes les données que vous insérez dans votre modèle doivent provenir de quelque part, non?
To replace tags with personalized data within a template, GTL draws information from either a dataobject or a datasource. So what’s the difference? / Pour remplacer les balises par des données personnalisées dans un modèle, GTL tire des informations d’un objet de données ou d’une source de données. Alors, quelle est la différence ?
- Dataobjects must be declared before referencing them, but you can use that information anywhere within your template. / Les objets de données doivent être déclarés avant de les référencer, mais vous pouvez utiliser ces informations n’importe où dans votre modèle.
- Datasources appear within tags in the template and provide data for only that scope. / Les sources de données apparaissent dans les balises du modèle et fournissent des données uniquement pour cette étendue.
Dataobjects / Objets de données
Dataobjects must include a name, a type value (inline, variable, or list), and a maxRows integer value. / Les objets de données doivent inclure un nom, un type de valeur (en ligne, variable ou liste) et une valeur entière maxRows.
This example includes a dataobject that places product information inside a personalized template. / Cet exemple inclut un objet de données qui place les informations produit dans un modèle personnalisé.
{{.dataobject RecProds type=list maxRows = 2}}
{{.data}}
{
"target" : "name:Products",
"filter" : "Product_Category == Category_Preference"
}
{{/data}}
{{/dataobject}}
{{!if data is found we'll execute the code in the Sections tag}}
{{#RecProds}}
{{First_Name}} {{Last_Name}}, based on your preference of {{Category_Preference}}, we suggest the following products…
SKU: {{sku}}
Product Name: {{Product_Name}}
<img src="{{Thumbnail_URL}}" alt="" />
{{/RecProds}}
{{!if no data is found we'll execute the code in the Inverted Sections tag}}
{{^RecProds}}
{{First_Name}} {{Last_Name}}, we do not have any product recommendations for you at this time.
{{/RecProds}}
Datasources / Source d’information
Like dataobjects, datasources require a name and maxRows value. / Comme les objets de données, les sources de données nécessitent un nom et une valeur maxRows.
You can also specify a Boolean global value that sets values back to the parent context after the block processes. / Vous pouvez également spécifier une valeur booléenne globale qui redéfinit les valeurs dans le contexte parent après les processus de bloc.
You can also specify five types of blocks. / Vous pouvez également spécifier cinq types de blocs.
- query
- inline
- list
- variable
- nested
Datasources allow for nested information. / Les sources de données permettent des informations imbriquées.
This example shows information stored in an AMPscript variable (that’s right, GTL accepts information from AMPscript and SSJS!) and uses it to populate subscriber information / Cet exemple montre les informations stockées dans une variable AMPscript (c’est vrai, GTL accepte les informations d’AMPscript et SSJS!) Et les utilise pour remplir les informations d’abonné.
%%[ var @Json set @Json = ' [{ "emailaddress": "john@example.com", "Region": "West", "State": "California", "City": "San Francisco", "PhoneNumbers": [{ "Type": "Home", "Number": "555-555-1111" }, { "Type": "Cell", "Number": "555-555-2222" }]}, { "emailaddress": "carla@example.com", "Region": "Central", "State": "Indiana", "City": "Indianapolis", "PhoneNumbers": [{ "Type": "Home", "Number": "555-555-4444" }, { "Type": "Cell", "Number": "555-555-5555" }]}]' ]%%
{{.datasource JSONVar type=variable maxRows = 20}}
{{.data}}
{ "target" : "@Json" }
{{/data}}
Email Address: {{emailaddress}}
Region: {{region}}
State: {{STATE}}
City: {{JSONVar.City}}
{{.datasource JSONPhone type=nested maxRows = 10}}
{{.data}}
{ "target" : "JsonVar.PhoneNumbers" }
{{/data}}
{{JSONPhone.Type}}: {{JSONPhone.Number}}
{{/datasource}}
{{/datasource}}
Note/ Remarque
To test this example, change the email addresses to real addresses to pass validation /Pour tester cet exemple, changez les adresses e-mail en adresses réelles pour passer la validation
Partials / Partiels
If you need to pull information in from your Portfolio or Content Builder, partials give you a handy shortcut. / Si vous devez extraire des informations de votre portfolio ou de votre générateur de contenu, les partiels vous offrent un raccourci pratique.
Just specify a key, ID, or name value inside a {{>}} tag, and you’re ready to go. / Spécifiez simplement une clé, un ID ou une valeur de nom dans une balise {{>}}, et vous êtes prêt à partir.
This tag pulls in a content area specified by a key. / Cette balise extrait une zone de contenu spécifiée par une clé.
{{>id:purchased_shoes refresh}}
The optional refresh tag forces the content to refresh at send time. / La balise de rafraîchissement facultative force le contenu à se rafraîchir lors de l’envoi.
This example pulls in information from a variable. / Cet exemple extrait des informations d’une variable.
{{>var:contentField}}
And this example syndicates content from a website. / Et cet exemple syndique le contenu d’un site Web.
{{>get:http://www.example.com}}
Now that you know more about Marketing Cloud’s programmatic languages, let’s cover how and when to use them. / Maintenant que vous en savez plus sur les langages de programmation de Marketing Cloud, voyons comment et quand les utiliser.