Créer un template via le signature builder
Ce tutoriel permet de créer un nouveau template de signature via le signature builder.
Choix de l'éditeur
Pour créer un template de signature, nous disposons de deux outils :
- le signature builder
- le signature codeur
Pour choisir le signature builder, il faut :
- Cliquer sur le bouton « Créer un template«
- Donner un nom au template
- Choisir « Signature builder«
Interface du signature builder
Le signature builder est séparé en 3 parties :
- La partie de gauche regroupe les éléments pouvant être ajoutés à la signature
- La partie centrale permet d’éditer la signature en fonction des éléments ajoutés
- La partie de droite permet de gérer les propriétés de chaque élément
Le signature builder fonctionne avec un système de Drag’n Drop (glisser – déposer). Vous définissez votre structure de signature ligne par ligne puis vous ajoutez les éléments dans les colonnes. Enfin, vous éditez les propriétés de chaque élément.
Première étape: créer sa ligne et ses colonnes
Comme mentionné précédemment, le signature builder fonctionne comme un système de drag’n drop. Cependant, avant de pouvoir intégrer les éléments, vous devez créer une ligne puis définir le nombre de colonnes de cette ligne.
Pour créer une ligne, vous devez cliquer sur le bouton « Ajouter une ligne » qui se situe en bas dans la partie centrale de l’éditeur.
Sélectionnez ensuite le nombre de colonnes que vous souhaitez avoir. Dans notre cas, nous allons en sélectionner deux.
Ensuite, vous allez pouvoir définir le layout de ces colonnes, encore appelé la disposition.
Pour faciliter la création des signatures, nous avons intégré les barres latérales directement dans les layout. Il suffit de sélectionner celui qui vous convient.
Il suffit ensuite de cliquer sur le bouton « Ajouter une ligne » pour finaliser la création de cette première ligne avec colonnes.
Deuxième étape : ajouter les éléments dans les colonnes
Maintenant qu’une première ligne et les colonnes sont éditées, nous allons ajouter des éléments.
Nous allons nous occuper de la colonne 1 et rajouter le logo de l’entreprise.
Vous sélectionnez l’élément « Logo entreprise » et vous venez l’ajouter à la colonne 1 via le système de drag’n drop.
Vous pouvez ajouter plusieurs éléments à la ligne.
Vous disposez de deux types d’éléments :
- Les éléments dynamiques
- Les éléments statiques
Les éléments dynamiques regroupent des données qui changent en fonction des coordonnées et informations. Par exemple, nom, prénom, bannière, numéro de téléphone, etc.
Les éléments statiques sont des éléments standards qui ne changent pas comme un texte qui apparaîtra partout, un séparateur pour l’édition de la signature, etc.
Troisième étape : éditer les propriétés de chaque élément
Chaque élément dispose de ses propres options appelées Propriétés tout comme la structure de la signature.
Elles permettent par exemple de choisir la couleur, d’afficher des éléments en gras ou italique, de centrer les éléments, afficher le mobile ou la ligne directe, etc.
La structure de la signature se présente sous quatre niveaux :
- La signature
- La ligne
- La colonne
- Les éléments
De manière générale, voici comment se présente la structure : Signature > Ligne > Colonnes > Elements
Pour différencier les éléments, nous avons édité un code couleur :
- Signature : orange
- Ligne : rouge
- Colonne : bleu
- Elément : vert
Ceci vous permettra de savoir quel éléments vous avez sélectionné.
Un rappel est disponible dans la partie « Propriété » sous l’option « Type« . Si c’est marqué « Colonne« , c’est que vous avez sélectionné une colonne et les propriétés affichées sont celles pour la colonne.
Vous pouvez également utiliser le navigateur en cliquant sur le bouton « Structure » en bas à droite.
Ceci vous permet de voir la structure de votre signature.
Quatrième étape : sauvegarder le nouveau template
Afin de vous familiariser avec le signature builder, nous vous invitons à éditer un template et tester toutes les options possibles.
Une fois finalisé, sauvegardez le template en cliquant sur le bouton « Sauvegarder » en haut à droite.