Agencement boîte / ligne / colonne

Dans WebAcappella, l’organisation des éléments suit une structure précise :

• Les boîtes sont les conteneurs principaux qui structurent la page.
• Les lignes s’insèrent directement dans les boîtes et permettent une organisation horizontale.
• Les colonnes sont des éléments comme les autres (texte, image, bouton) et doivent être glissées dans une ligne pour organiser le contenu verticalement.

Cette hiérarchie permet de concevoir des mises en page flexibles et adaptatives.

Légende des couleurs

Dans l’interface de WebAcappella, chaque élément structurant la page est matérialisé par une couleur spécifique :

• Marron pour les boîtes.
• Rose pour les lignes.
• Vert pour les colonnes.

Lorsqu’un élément est sélectionné, il est entouré d’un encadrement de la même couleur.

Créer une nouvelle page

1. Créer une nouvelle page dans WebAcappella.
2. Une boîte contenant une ligne y est placée automatiquement.

Ajouter des colonnes dans une ligne

1. Chaque ligne se divise en 12 crans, ce qui permet d'ajuster facilement la largeur des colonnes.
2. On glisse une ou plusieurs colonnes par glisser-déposer dans la ligne.
3. Répéter l’opération pour ajouter plusieurs colonnes côte à côte.
4. Redimensionner les colonnes en ajustant leurs proportions.
5. Dans chacune des colonnes créées, on glissera les éléments souhaités (texte, image, bouton, etc.) qui occuperont la largeur de la colonne.

Ajouter des boîtes et lignes

1. Vous pouvez glisser autant de boîtes que nécessaire dans une même page.

Conseils pratiques

• Privilégier une structure claire en utilisant plusieurs boîtes pour organiser la page.
• Utiliser les colonnes pour équilibrer la mise en page, mais éviter d’en mettre trop pour ne pas surcharger l’affichage mobile.
• Tester régulièrement le mode responsive pour s’assurer d’un bon affichage sur tous les écrans.