Passer au contenu principal
Toutes les collectionsApparencesApparences avancées
Comment créer une apparence avancée à partir d'un modèle ?
Comment créer une apparence avancée à partir d'un modèle ?

Tout savoir sur les modèles d'apparence avancée

Alexandre Santini avatar
Écrit par Alexandre Santini
Mis à jour il y a plus de 5 mois

Pour vous aider ou vous inspirer, nous vous avons concocté plusieurs modèles d'apparence avancée.

Ces modèles sont 100% personnalisables dans l'espace de construction.

Choisir un modèle

Lorsque vous créez une apparence avancée, un sélecteur de templates vous sera proposé immédiatement. Vous avez alors l'option de choisir un modèle sur lequel partir, ou de démarrer de zéro.

Si vous choisissez cette dernière option, vous aurez malgré tout la possibilité de sélectionner un modèle en cliquant sur [Partir d'un modèle] en haut à gauche de votre écran :

Si vous choisissez de partir sur un modèle, vous trouverez une sélection exhaustive contenant pour chaque template une description correspondant à un cas d'usage différent.

Continuons avec les deux premiers modèles issus de la sélection de templates:

  • Paywall dynamique classique

  • Paywall dynamique avec offres d'abonnement

Paywall classique

Ce modèle propose un design basique, comprenant un composant "Widget dynamique".

Il est également doté d'une signature : un texte qui s'affiche en dessous du contenu, uniquement après le déblocage.

Paywall avec offres d'abonnement

Il s'agit d'un modèle plus sophistiqué, qui intègre différents composants basiques et dynamiques.

Il est également doté d'une signature : un texte qui s'affiche en dessous du contenu, uniquement après le déblocage.

Appliquer le modèle

Une fois votre choix fait, cliquez sur [Suivant] en bas à droite de l'écran afin de poursuivre le processus de création.

🚨 Si vous aviez précédemment initié la création d'un wall dans l'espace de construction, cette action écrasera les éléments créés. Pour revenir en arrière et retrouver vos éléments, rechargez votre page sans sauvegarder.

Personnaliser l'habillage

Une fois votre modèle choisi, vous trouverez une fenêtre permettant de personnaliser certains éléments graphiques du modèle.

Selon les templates, des possibilités de design différentes existent, notamment des palettes de couleurs prédéfinies, la couleur des textes, des boutons, du fond, ou encore l'arrondi des bordures ou l'ombre portée.

Personnaliser les éléments

Une fois le modèle choisi et les réglages de design appliqués, vous vous trouvez alors dans l'espace de construction où vous pouvez voir l'intégralité des composants utilisés dans le modèle.

Aperçu du modèle paywall classique :

Aperçu du modèle paywall avec offres d'abonnement :

Vous pouvez maintenant personnaliser votre modèle en modifiant, déplaçant, ou supprimant tous les composants. Vous pouvez également en ajouter !

N'hésitez pas à vous rendre dans les propriétés de l'apparence afin de changer les paramètres de design précédemment appliqués, ainsi qu'ajouter du CSS personnalisé.

À vous de jouer 🎨

Pour en savoir plus sur les composants disponibles et leurs options, lisez notre article 👉 Quels sont les composants du nouvel éditeur de design ?

Si vous avez des questions, n'hésitez pas à nous contacter via le chat !

Avez-vous trouvé la réponse à votre question ?