Éditeur Studio : Personnaliser une grille de section
Temps de lecture : 6 min
Dans l'Éditeur Studio, les sections sont livrées avec une grille intégrée, contenant une seule cellule (contenant toute la section). Divisez la section en plusieurs cellules pour donner une structure responsive au contenu. Vous pouvez choisir parmi différentes mises en page personnalisables.
Dans cet article, apprenez comment :
Vous souhaitez ajouter des cellules à un conteneur ?
Vous pouvez appliquer une grille CSS avancée sur le conteneur.
Ajouter des cellules à une section
Ajoutez des cellules à une section pour créer une mise en page adaptative et structurée. Le fait de garder les éléments dans des cellules séparées permet de garantir qu'ils restent en place sur tous les écrans. Choisissez une mise en page, puis déplacez les éléments vers les cellules. Vous pourrez toujours diviser les cellules ou en ajouter de nouvelles plus tard.
Pour ajouter des cellules à une section :
- Sélectionnez la section appropriée dans l'Éditeur.
- Cliquez sur le menu déroulant Vide en haut de la section.
- Choisissez une mise en page : Rangées, Colonnes, Collage, etc.
Suggestion : Vous pouvez modifier la mise en page à partir du menu déroulant à tout moment - vos éléments ne seront pas déplacés. - (Facultatif) Faites glisser des éléments vers les cellules correspondantes.
Échanger des cellules dans la grille
Réorganisez la section des grilles rapidement et efficacement en échangeant des cellules. Par glisser-déposer, vous pouvez instantanément basculer entre 2 cellules - elles s'occupent instantanément de la place de l'autre sur la grille.
Pour échanger les cellules :
- Sélectionnez la section appropriée dans l'Éditeur.
- Sélectionnez la première cellule.
- Maintenez l'icône de glissement
en haut de la cellule tout en le faisant glisser sur l'autre cellule.
Suggestion : Lorsque vous voyez l'indication Échanger du contenu , cela signifie que vous pouvez déposer la cellule.
Personnaliser la grille de la section
Donnez aux cellules et à la grille l'aspect que vous souhaitez. Vous pouvez diviser ou fusionner des cellules existantes, en ajouter de nouvelles et faire glisser les lignes de la grille pour ajuster leur taille. Vous pouvez également ajouter des espaces pour créer un espace entre les cellules.
Pour personnaliser la grille de la section :
- Sélectionnez la section appropriée dans l'Éditeur.
- Choisissez comment vous souhaitez personnaliser la grille :
Diviser une cellule existante
ou diviser verticalement 
.
Ajouter une nouvelle cellule
Fusionner les cellules
Redimensionner une cellule
Ajouter des espaces entre les cellules
Supprimer une cellule
.Remarque :
Pour le moment, il n'est pas possible de dupliquer une cellule.
Passer à une grille CSS avancée
Passer à une grille CSS avancée vous donne un contrôle plus précis de la mise en page par point de rupture. Vous pouvez choisir le nombre de lignes et de colonnes que vous souhaitez, et définir leur taille à l'aide de mesures adaptatives (ex. fr, min./max., %).
Pour passer d'une grille de section à une grille CSS :
- Sélectionnez la section appropriée dans l'Éditeur.
- Cliquez sur la flèche Ouvrir l'inspecteur
en haut à droite de l'Éditeur. - Faites défiler la page jusqu'à Mise en page.
- Cliquez sur Bouton à côté de Grille CSS avancée.
- Cliquez sur Passer à la grille CSS.
Cela vous a-t-il aidé ?
|