Contenu à partir d'un HTML importé

À la création d'un nouveau contenu (template, message ou page), l'utilisateur peut importer un code HTML existant.

Pour importer le code HTML et les images:

1. Sélectionnez 'Importer fichier' et cliquez sur Suivant.

2. Dans l'écran suivant, définissez les propriétés du contenu (Nom, Nom API, Description, Audience et Langues). Pour plus d'informations sur ces propriétés, consultez cette rubrique pour les propriétés des templates ; cette rubrique pour les propriétés des messages et cette rubrique pour les propriétés des pages.

3. Cliquez sur Suivant et définissez les paramètres de l'HTML importé:

Téléchargement des images activé/désactivé — Activer ou désactiver cette option pour indiquer si vous souhaitez ou non télécharger les images associées aux fichiers HTML.
Dossier images cibles — Lorsque le téléchargement des images est activé, vous devez définir le dossier dans lequel ces images doivent être enregistrées. Cliquez sur le bouton [...] pour rechercher l'emplacement.
Résolution du conflit lié au téléchargement d'images — Sélectionnez dans cette liste déroulante la manière dont les conflits liés aux images existantes portant le même nom doivent être résolus.
- Renommer les images téléchargées en conflit — Les images téléchargées se verront attribuer le nom original + un index.
- Remplacer les images existantes par les images téléchargées — L'image existante est supprimée et la nouvelle image est téléchargée.
- Conserverles images existantes — Le template téléchargé utilise les images existantes et les images en conflit ne sont pas téléchargées.

4. Vous pouvez ensuite choisir de télécharger un fichier à partir d'un dossier local ou de récupérer le contenu HTML d'une URL en ligne.

Local — Cliquez sur le bouton 'Sélectionner fichier' pour rechercher le fichier ou déposer un fichier. Il peut s'agit d'un fichier HTML ou d'un fichier zip. En principe, le fichier zip contient un fichier HTML et quelques images. Le fichier HTML est importé sous la forme de contenu (un template, un message ou une page) et les images sont stockées dans le dossier sélectionné.

Remarque:
- Assurez-vous que le fichier ZIP contient exactement un fichier HTML.
- Seuls les fichiers HTML et les fichiers d'images sont pris en charge dans le ZIP, pas les fichiers TXT par exemple.
- Les problèmes d’encodage du nom de fichier du contenu du fichier peuvent provoquer un échec lors de l’importation. Veillez à ce qu'ils soient correctement codés.

En ligne — Entrez l'URL à partir de laquelle le contenu HTML doit être récupéré.

Remarque : Veuillez noter que les références de l'image dans le template/message ne peuvent être téléchargées que lorsqu'elles sont absolues.
En outre, la taille maximale du fichier HTML ou ZIP importé est fixée à 50 Mo. Si l'option de téléchargement d'images est activée et que les fichiers HTML/ZIP ont une taille de 50 Mo, les images seront quand même téléchargées.

8. Lorsqu'elle est cochée, l'option 'Réutiliser le lien pour la même URL' regroupe tous les liens pointant vers la même URL en un lien unique dans Selligent. Si l'option est décochée, un lien Selligent distinct est créé pour chaque a balise trouvé dans la source, même s'il pointe vers la même URL.

9. L'option 'Convertir le texte et les images du fichier HTML importé en composants multilingues' vous permet de définir si les balises HTML doivent être converties en balises Selligent SG. Nous vous recommandons de cocher cette option si vous travaillez avec plusieurs langues. Ces balises Selligent SG vous permettent de créer un contenu différent pour les différentes langues. Si vous travaillez avec une seule langue, nous vous recommandons de désactiver cette option.

Remarque : Si vous cochez cette case, les balises HTML sont converties en balises Selligent SG et le style global est appliqué à ces composants. Si vous souhaitez garder le code HTML et le style défini, ne cochez pas cette option.

10. L'option Ajouter les styles globaux par défaut vous permet de choisir si les styles du HTML importé doivent être appliqués au message ou si les styles globaux par défaut d'Selligent doivent être appliqués.
Avec la bascule activée, les styles globaux par défaut sont définis dans le message Selligent après l'importation du HTML et remplaceront tous les styles locaux définis dans le HTML.
Lorsque la bascule est désactivée, les styles globaux par défaut ne sont pas définis (restent vides) dans le message Selligent après l'importation du code HTML. Tous les styles disponibles dans le HTML importé sont ensuite utilisés.

11. Appuyez sur Suivant. Le contenu s'affiche en mode Source.

Remarque : Si vous avez sélectionné plusieurs langues, le contenu sera identique pour toutes les langues puisqu'il se basera sur le même HTML. L'ajout de composants de contenu dans l'HTML vous permet néanmoins de définir un contenu différent pour les différentes langues.

Remarque technique :
Lorsque le code HTML est importé, un certain nombre de balises HTML sont converties en balises SG propres à Selligent et en propriétés:
* toutes les balises IMG sont converties en balises SG:img id:x
* le contenu texte est converti en balises SG:content.
Lorsque vous cliquez sur ces balises dans la fenêtre Source, la fenêtre Propriétés s'affiche à droite. Elle vous permet d'éditer le texte et les images.
* Les liens dans la source sont convertis en liens suivis dans Selligent. Ces liens sont ajoutés à l'onglet Liens pour le template ou message et sont automatiquement liés.
* Les liens sur les images sont également convertis en liens suivis pour le template ou le message. Ils sont par ailleurs ajoutés en tant que propriété sur l'image.
* Les balises SG (par exemple, sg:var, sg:image, etc.) spécifiques à Selligent ne sont pris en charge que dans les blocs de contenu créés dans la bibliothèque. Actuellement, ils ne sont pas pris en charge pour être utilisés lors de l'importation de HTML pour les messages, les templates et les pages. Les attributs de lien (par exemple: data-link, unsubscribe-link, etc) d'autre part, sont pris en charge dans les blocs de contenu créés dans la bibliothèque ainsi que via les importations HTML.

Les extensions de fichiers image/types MIME suivantes sont prises en charge durant l'importation HTML :
.art;image/x-jg
.bmp;image/bmp
.cmx;image/x-cmx
.cod;image/cis-cod
.gif;image/gif
.ico;image/x-icon
.ief;image/ief
.jfif;image/pjpeg
.jpg;image/jpeg
.pbm;image/x-portable-bitmap
.pgm;image/x-portable-graymap
.png;image/png
.pnm;image/x-portable-anymap
.ppm;image/x-portable-pixmap
.ras;image/x-cmu-raster
.rf;image/vnd.rn-realflash
.rgb;image/x-rgb
.tiff;image/tiff
.wbmp;image/vnd.wap.wbmp
.xbm;image/x-xbitmap
.xpm;image/x-xpixmap
.xwd;image/x-xwindowdump

Exemple 1 :

Conversion des balises a en liens suivis, la source:

Devient:

Tous les liens sont ajoutés à l'onglet Liens.

Remarque :
Lorsque le lien importé est converti, un nouveau lien suivi est créé dans le panneau Liens avec un ID aléatoire.
Lorsque le fichier HTML source contient déjà la syntaxe correcte (par exemple <a expr:href="LINK(101)">), il n'est pas nécessaire de le convertir. Un lien suivi avec cet ID exact est créé.
Cela implique que si vous voulez utiliser le lien(0) standard de la version Web, vous devez utiliser la syntaxe Selligent dans votre source et utiliser l'ID=0.
<a expr:href="LINK(0)">Webversion</a>
Dans ce cas, aucun nouveau lien suivi n'est créé, mais le lien(0) existant de la version web est utilisé à la place.

Exemple 2 : Conversion des balises IMG en balises SG

Dans l'HTML source, la balise IMG suivante est disponible. La source de l'image est un chemin relatif.

Dans la source du template Selligent, elle est traduite en balise SG:

Le texte source et tout autre texte sont repris, de même que les options de style.

Sila source de cette image est un chemin relatif, l'image n'est pas téléchargée et lesuivants'affiche dans le champ source.

Exemple: ONLY_ABSOLUTE_IMAGE_PATH_ARE_SUPPORTED - images/spacer.gif)

Cependant, si la source de l'image est un chemin absolu, l'image sera référencée correctement dans le champ source des propriétés. (par ex., [%resource('img/logo.jpg')%])

Si un lien est disponible sur l'image, il est traduit en propriété sur cette image. Le lien est ajouté à la liste des liens, ainsi qu'aux propriétés de l'image.

Le fichier suivant est un exemple: