Créer des messages in-app dans l'éditeur intégré

Construisez un modèle de message in-app dans l’éditeur intégré de Pushwoosh sans écrire de code. Vous obtenez une mise en page réutilisable avec des blocs de contenu, des images, des boutons et du texte personnalisé que vous pouvez afficher dans un Customer Journey, en tant qu’in-app ponctuel ou à partir d’une notification push.

Créer un nouveau modèle in-app

Un modèle in-app est un design réutilisable que vous créez une fois puis que vous montrez aux utilisateurs dans des campagnes. Vous pouvez en créer un dans l’éditeur intégré, télécharger un ZIP HTML personnalisé ou construire un modèle rich media natif. Cet article couvre la création d’un modèle à partir de zéro dans l’éditeur intégré. Suivez les mêmes étapes pour personnaliser un modèle existant.

Allez dans Contenu → In-apps.
Cliquez sur Ajouter un modèle.

Page Contenu In-apps avec le bouton Ajouter un modèle en haut à droite de la liste des modèles

Saisissez un nom de modèle.
Choisissez comment créer le modèle :
- Créer un nouveau modèle : construisez un modèle dans l’éditeur intégré.
- Télécharger un ZIP : téléchargez un fichier ZIP avec votre message in-app HTML.
- Créer un rich media natif : construisez un in-app natif rendu par le SDK. En savoir plus
Sélectionnez Créer un nouveau modèle.
Cliquez sur Ajouter un modèle.

Boîte de dialogue Ajouter un nouveau modèle avec le champ nom, l'option Créer un nouveau modèle sélectionnée, et les options Télécharger un ZIP et Créer un rich media natif

Explorer la mise en page de l’éditeur

L’éditeur intégré comporte quatre zones. Chacune a une fonction claire.

Barre supérieure

La barre supérieure est l’endroit où vous gérez le modèle dans son ensemble : son nom, l’historique d’annulation, l’état de l’enregistrement, son apparence sur l’appareil (Paramètres in-app), les langues (Traduction automatique et le sélecteur de langue), et la largeur de l’aperçu sur téléphone ou ordinateur. Voir Configurer l’apparence de l’in-app sur l’appareil et Localiser le modèle.

Ouvrez le menu ⋮ dans la barre supérieure pour plus d’actions :

Aperçu

Aperçu vous permet d’essayer le message avant de l’enregistrer : appuyez sur les boutons, parcourez les flux multi-écrans et vérifiez la mise en page sur téléphone ou ordinateur.

Ce qui fonctionne dans l’aperçu :

Les boutons et les flux multi-écrans s’exécutent réellement.
Les liens et les liens profonds sont signalés, mais pas ouverts.
Les appels SDK et les statistiques d’ouverture/clic restent désactivés.
La langue correspond au sélecteur de langue. Les Merge Tags restent des placeholders.

Dans l’en-tête de l’aperçu, basculez entre téléphone et ordinateur pour voir les deux mises en page. Cliquez sur Redémarrer pour afficher à nouveau le message depuis le début. Pour quitter l’aperçu, appuyez sur Échap ou cliquez en dehors du panneau.

Brand book

Brand book : ouvrez le Brand book de votre compte.
Appliquer les styles du brand book : redéfinissez le style du modèle pour qu’il corresponde à votre Brand book (une fois que vous en avez configuré un).
Réinitialiser les styles personnalisés : supprimez les surcharges de style sur le modèle et revenez aux valeurs par défaut.

Canevas

Modifiez le message sur le canevas : cliquez sur le texte, les images et les boutons pour les changer. Utilisez le sélecteur téléphone/ordinateur dans la barre supérieure pour vérifier l’apparence de la mise en page à chaque largeur. Le sélecteur ne change que l’aperçu, pas la mise en page elle-même.

Calques

Le panneau Calques liste chaque bloc de votre modèle sous forme d’arborescence, dans le même ordre que sur le canevas. Ouvrez-le depuis le bord gauche pour sélectionner un bloc imbriqué (par exemple, un bouton à l’intérieur d’un groupe) ou faites glisser les lignes pour réorganiser le contenu.

Panneau de droite

Basculez entre trois onglets :

Blocs : ajoutez du contenu au message. Voir Référence des blocs de l’éditeur in-app.
Paramètres : appliquez un style à l’ensemble du modèle en une seule fois. Voir Configurer les paramètres du modèle in-app.
IA : discutez avec l’assistant IA pour générer ou modifier du contenu à partir d’une instruction.

Onglet Blocs dans le panneau de droite avec les blocs de contenu Titre, Texte, Bouton, Image et autres

Ajouter des blocs de contenu

Ouvrez l’onglet Blocs dans le panneau de droite.
Faites glisser un bloc sur le canevas, ou cliquez sur un bloc pour l’ajouter à la fin du modèle.
Continuez à ajouter des blocs jusqu’à ce que la mise en page soit prête.

Éditeur in-app vide avec 'Commencer avec un bloc' sur le canevas et le panneau des Blocs ouvert

Chaque type de bloc a un but différent dans le message :

Titre : titres et en-têtes courts
Texte : corps de texte et descriptions plus longues
Bouton : un appel à l’action cliquable
Image : images de la Médiathèque, téléchargées ou depuis une URL
Vidéo : une vignette vidéo cliquable qui ouvre une vidéo YouTube ou Vimeo
Carte : une image avec un titre, du texte et un bouton dans une seule mise en page
Séparateur : une ligne qui sépare les sections
Colonnes : mises en page côte à côte (2, 3 ou 4 colonnes égales, ou des divisions 33/67 et 67/33)
Minuteur : un compte à rebours pour les offres et les dates limites
Menu : une rangée ou une colonne de liens de navigation ou de contact
Social : icônes qui renvoient à vos profils sociaux
HTML : HTML personnalisé, comme un formulaire, un sondage ou une vidéo intégrée
Produits : une grille de fiches produits de votre Catalogue de produits ou du panier abandonné d’un utilisateur

Consultez la référence des blocs de l’éditeur in-app pour les paramètres de chaque bloc, et comment enregistrer et réutiliser des blocs.

Afficher des blocs à des utilisateurs spécifiques

Tous les utilisateurs n’ont pas besoin de voir les mêmes blocs. Définissez une condition d’affichage sur un bloc pour qu’il s’affiche ou se masque en fonction des Tags de l’utilisateur. Vous envoyez toujours un seul modèle, mais chaque personne ne voit que les parties qui la concernent.

Sélectionnez le bloc sur le canevas, ouvrez Condition d’affichage dans le panneau de droite, et activez Afficher ce bloc conditionnellement. En savoir plus

Localiser le modèle

Un modèle multilingue stocke le contenu localisé pour chaque langue dans un seul design in-app. Utilisez le sélecteur de langue dans la barre supérieure pour ajouter des langues et modifier le contenu par langue. Cliquez sur Traduction automatique pour générer des traductions. Pour savoir comment la messagerie multilingue fonctionne sur tous les canaux, consultez Messagerie multilingue.

Configurer les paramètres du modèle

Utilisez deux endroits pour styliser et placer le message :

Onglet Paramètres (panneau de droite) : taille du document, couleurs, typographie et styles par défaut pour les blocs.
Paramètres in-app (barre supérieure) : position à l’écran, animations et bouton de fermeture.

Enregistrer le modèle

Cliquez sur Enregistrer dans la barre supérieure pour sauvegarder vos modifications. Utilisez Annuler/Rétablir dans la barre supérieure pour avancer et reculer dans vos modifications.