Que vous utilisiez un modèle ou que vous partiez de 0, nous vous détaillons ici quelques trucs et astuces pour tirer le maximum du nouvel éditeur de design.

Avant de vous lancer, n'hésitez pas à consulter notre article complet sur les composants 👉 Quels sont les composants du nouvel éditeur de design ?

L'utilisation de rangées vous permet de compartimenter simplement votre wall.

Cela vous permettra de gérer plus facilement le responsive, le comportement avant/après déblocage, les espacements etc. de chaque "bloc" de votre wall.

Également, cela vous permettra de créer des colonnes et de gérer leur disposition horizontale et verticale.

Bref, la Rangée c'est LE composant qui vous facilitera la vie ✨

Si vous avez des composants ou des blocs entiers qui se répètent, vous pouvez simplement les dupliquer en cliquant sur l'icône [⧉] présente sur chaque élément.

Vous pourrez ensuite déplacer les éléments copiés par glisser-déposer (drag & drop) dans un autre bloc.

Lorsque vous utilisez une rangée, cela vous donne une colonne.

Si vous découpez la rangée en 3 (à l'aide des petits + sur les côtés), cela vous donne 3 colonnes.

"Élémentaire mon cher Watson" 🕵️‍♂️

Dans chaque colonne, vous pouvez insérer un ou plusieurs composants les uns en dessous des autres.

Par défaut, les colonnes ont une taille "flexible". C'est-à-dire qu'elles occuperont en largeur tout l'espace disponible.

Vous pouvez modifier la largeur de chaque colonne dans l'onglet "Paramètres" de chacune.

Grâce aux options "Responsive" vous êtes en capacité de gérer extrêmement précisément l'affichage des éléments pour chaque taille d'écran.

Vous pouvez par exemple décider de masquer ou d'afficher un élément ou de modifier la taille des colonnes/rangées selon la taille de l'écran.

Pour gérer ces options, cliquez sur l'icône [✏️] de l'élément souhaité et rendez-vous dans l'onglet "Responsive".

Grâce au nouvel éditeur de design, vous avez la capacité de gérer le comportement de chaque élément avant et après déblocage de l'article.

Les éléments sont par défaut visible avant déblocage et masqué après.

Les éléments visibles après le déblocage apparaîtront en bas du contenu débloqué.

Pour gérer ces options, cliquez sur l'icône [✏️] de l'élément souhaité et rendez-vous dans l'onglet "Paramètres".

Dans cet espace, vous pouvez personnaliser de manière groupée la couleur des boutons, des liens et du fond de votre wall.

Notre nouvel éditeur de design offre de belles possibilités sans code. Pour autant, vous pouvez aller encore plus loin en ajoutant seulement quelques lignes de CSS !

Vous trouverez le champ pour insérer votre CSS dans l'espace "Modifier les propriétés de l'apparence".

Pour rappel, vous pouvez ajouter sur chaque rangée, colonne ou composant des classes CSS additionnelles dans l'onglet "Styles" des options.

Beaucoup de ressources en ligne gratuites existent pour vous aider à comprendre le fonctionnement du CSS et les propriétés à utiliser.

Lancez-vous et repoussez les limites de vos walls 🚀