Articles sur : Espaces

Widget Bento

Le widget Bento est un conteneur en grille configurable — une coque de mise en page où chaque cellule accueille son propre bloc. Utilisez-le lorsque vous voulez un ensemble structuré de petits éléments de poids égal : une grille de fonctionnalités, une liste d'équipe, un tableau de bord en tuiles, un panneau « ce qui est inclus ».

Pensez à une boîte bento. Plusieurs compartiments à l'intérieur d'un seul cadre, chacun rempli indépendamment, taillés à la même forme extérieure.

Comment l'ajouter

Sur la barre d'édition en bas de l'éditeur, ouvrez le menu ⌄ Tous les widgets et repérez Bento.
Faites-le glisser dans la section cible.
Par défaut, une grille 2 × 2 s'affiche, chaque cellule présentant un emplacement + Ajouter un bloc. Cliquez sur une cellule, choisissez un type de bloc, et la cellule est remplie.

Cliquez sur le Bento (en dehors d'une cellule individuelle) pour sélectionner le conteneur :

Modifier la ressource (icône curseurs) — ouvre la popover Paramètres de mise en page (lignes, colonnes, préréglages — voir ci-dessous).
Design (icône pinceau) — ouvre le Panneau Design contextuel du conteneur Bento lui-même.
⋮ Plus — Modifier la ressource (identique à l'icône curseurs) · Dupliquer · Supprimer.

(Pas de Taille / Mode sombre / Remplacer / Étendre — ce sont les cellules, et non le conteneur, qui contiennent le contenu.)

Ouvrez-la via l'icône curseurs du menu flottant. Deux façons de façonner la grille :

Mises en page rapides (boutons de préréglage)

Huit mises en page en un clic :

2 colonnes · 3 colonnes · 4 colonnes — une seule ligne divisée en 2 / 3 / 4 cellules.
2 × 2 · 2 × 3 · 3 × 3 — grilles symétriques sur plusieurs lignes.
Barre à gauche — une colonne étroite à gauche + une zone plus large à droite.
Barre à droite — pareil mais en miroir : plus large à gauche, colonne étroite à droite.

Mise en page manuelle (lignes + colonnes)

Sous les préréglages, définissez la grille à la main :

Lignes — champ numérique (avec un interrupteur de liaison pour conserver des lignes égales).
Colonnes — identique.
Égaliser les tailles — bouton. Réinitialise toute largeur personnalisée de ligne/colonne à une répartition égale.

Lorsque vous modifiez les lignes / colonnes, les cellules existantes sont préservées autant que possible ; les nouvelles cellules apparaissent comme des emplacements vides + Ajouter un bloc.

Contrôles par cellule

Chaque cellule a son propre comportement. Cliquez dans une cellule pour la sélectionner, puis :

Cliquez sur + Ajouter un bloc pour déposer un type de bloc dans cette cellule (Texte, Image, Vidéo, Lien, etc. — même sélecteur qu'ailleurs).
La cellule active affiche son propre menu ⋮ dans le coin supérieur droit avec les commandes structurelles au niveau de la cellule :
Fusionner vers le bas — combine cette cellule avec celle juste en dessous en une seule cellule.
Fusionner à gauche — combine avec la cellule à gauche.
Ajouter une ligne au-dessus / Ajouter une ligne en-dessous — insère une nouvelle ligne de cellules à cette position.
Ajouter une colonne à gauche / Ajouter une colonne à droite — insère une nouvelle colonne à cette position.
Supprimer la ligne — supprime toute la ligne à laquelle appartient cette cellule.
Supprimer la colonne — supprime toute la colonne à laquelle appartient cette cellule.

Utilisez les fusions pour briser la grille symétrique et créer de l'emphase — par ex. prenez une disposition 2×3 et fusionnez deux cellules horizontalement pour créer une tuile vedette plus large, tout en conservant les autres comme des cartes plus petites.

Ce qui peut aller dans une cellule

Une cellule Bento peut accueillir n'importe quel type de bloc que vous pouvez déposer via la barre d'édition — Texte, Image, Vidéo, Lien, CTA, Contact, etc. Le bloc vit à l'intérieur de la cellule et est sélectionné/édité comme n'importe quel autre bloc (avec son propre menu flottant).

Quand l'utiliser

Grille de fonctionnalités — 6 cellules avec une icône + une courte légende chacune.
Vitrine d'équipe — Cartes Contact disposées dans une grille 2×3.
« Ce qui est inclus » — tuiles décrivant ce qui est inclus dans un plan.
Mur média mixte — une image vedette fusionnée sur deux cellules, avec des liens/textes complémentaires dans le reste.

Quand NE PAS l'utiliser

Contenu long — les Bentos compressent le contenu ; si vous avez des paragraphes de récit, utilisez plutôt des widgets Texte dans une section classique.
Une seule chose par ligne — si chaque ligne ne contient qu'un seul bloc, vous n'avez pas besoin d'un Bento. Empilez simplement des widgets dans une section normale avec la Compaction activée.

Articles liés

Mis à jour le : 18/06/2026

Cet article a-t-il répondu à vos questions ?

Merci !