Conteneur

Aperçu

Le composant Avonni Container offre une base visuellement attrayante pour votre contenu. Que vous visiez une apparence raffinée de type carte, une mise en page encadrée ou une présentation plus standard, ce composant s'adapte sans effort.

🎥 Tutoriels

Maximiser le potentiel de votre site avec Avonni Container

Options de design polyvalentes pour tous les besoins

Le composant Avonni Container se distingue par sa gamme de variantes de style - Card, Box et Standard - chacune conçue pour répondre à différents besoins de contenu.

• Le Carte la variante est parfaite pour des sections accrocheuses comme les témoignages, ajoutant du style à votre contenu.

• Le Box la variante brille lorsqu'il s'agit de mettre en valeur des produits ou des fonctionnalités clés, les faisant ressortir.

• Le Standard la variante offre un aspect propre et cohérent pour un contenu plus conventionnel, maintenant l'harmonie sur votre site.

Visuels dynamiques pour sublimer votre site

Avec Avonni Container, vous pouvez animer diverses sections grâce à des images de fond uniques. Imaginez ajouter des photos d'équipe vives à votre section « À propos » ou représenter des paysages sereins pour des thèmes sur la durabilité. Ces visuels dynamiques renforcent l'attrait esthétique et aident à mieux communiquer l'histoire de votre marque.

Lisibilité et style

Assurer que le contenu se détache sur des arrière-plans chargés ou colorés est crucial en conception web. Avonni Container relève ce défi grâce à l'utilisation de superpositions de couleur. Imaginez une superposition sombre sur un arrière-plan festif, faisant ressortir les détails de votre événement, ou une teinte subtile qui ajoute de la profondeur à votre contenu tout en préservant la lisibilité.

Contrôle total sur la présentation

Avonni Container offre un contrôle étendu sur la taille, l'arrière-plan et les bordures de chaque section. Cela signifie que vous pouvez régler avec précision la manière dont votre contenu occupe l'espace, adapter les couleurs ou images de fond pour correspondre à votre thème et ajuster les paramètres de bordure pour plus de définition. Chacun de ces éléments joue un rôle central dans l'amélioration de la structure visuelle de votre page.

Adaptabilité pour des publics divers

Dans le paysage numérique d'aujourd'hui, répondre aux besoins variés du public est essentiel. Avonni Container est conçu avec cette adaptabilité à l'esprit. Que vous utilisiez le style Card pour des sections d'actualités dans des portails partenaires ou le style Box pour mettre en avant des offres spéciales dans des hubs clients, ce composant garantit que votre contenu soit vu et trouve un écho auprès de votre audience.

Récapitulatif

Le composant Avonni Container est plus qu'un simple outil ; c'est une toile pour la créativité et une solution aux divers défis de conception web lors de l'utilisation d'Experience Cloud. Sa polyvalence, ses capacités visuelles dynamiques, ses améliorations de lisibilité et ses options d'affichage de contenu adaptables en font un élément indispensable pour tout site Salesforce Experience Cloud. Que vous cherchiez à captiver, informer ou engager, Avonni Container vous permet de tout faire avec style et efficacité.

Paramètres

🎛️ Propriétés

Définition de la variante

🎨 Style

Nom

Description

Utilisation

Variante

Choisissez une variante de style pour définir l'apparence générale du conteneur. En savoir plus

Sélectionnez une variante qui s'aligne sur votre vision de design, que vous préfériez une présentation simple, encadrée ou de type carte pour votre contenu.

Image de fond

Définissez une image de fond pour le conteneur.

Téléversez ou fournissez une URL pour une image qui améliore l'attrait visuel du conteneur, contribuant à l'ambiance ou au ton thématique que vous souhaitez transmettre.

Couleur de superposition

Appliquez une superposition de couleur par-dessus l'image de fond.

Choisissez une couleur qui recouvre subtilement l'image de fond, aidant à maintenir la visibilité et la lisibilité du contenu à l'intérieur du conteneur.

Le Variante la propriété du composant Avonni Container est une fonctionnalité cruciale qui définit le style et la structure fondamentaux du conteneur, posant la base de la manière dont le contenu à l'intérieur est affiché et interagit. Voici une explication détaillée de chaque variante :

Standard

• Description : Le standard la variante offre un style basique et minimaliste. Le réglage par défaut fournit un conteneur propre et simple sans éléments stylistiques supplémentaires. Cette variante est idéale pour le contenu qui nécessite une mise en page simple sans besoin d'accent visuel supplémentaire.

• Utilisation : Utilisez la standard variante lorsque vous avez besoin d'une présentation simple et épurée. Elle est parfaite pour les cas où le contenu doit ressortir sans stylisation supplémentaire du conteneur. Cette variante convient aux blocs d'information, aux sections riches en texte, ou lorsque vous souhaitez que l'attention porte exclusivement sur le contenu plutôt que sur le conteneur.

Box

• Description : Le box la variante ajoute plus de définition au conteneur, généralement par des bordures ou un léger ombrage, donnant l'apparence que le contenu est « encadré ». Cette variante crée un sens de profondeur et d'emphase, le faisant ressortir plus nettement sur la page.

• Utilisation : Optez pour la box variante lorsque vous souhaitez attirer davantage l'attention sur le conteneur, par exemple pour du contenu en vedette ou des avis importants, ou lorsque vous voulez séparer visuellement différentes sections de la page. Le style encadré est bénéfique dans les mises en page où plusieurs éléments conteneurs nécessitent une séparation distincte ou lors de la création d'une interface de type tableau de bord.

Carte

• Description : Le card la variante transforme le conteneur en une mise en page de type carte, généralement caractérisée par un ombrage (donnant un effet flottant), des coins arrondis et éventuellement une bordure plus prononcée.

• Utilisation : Le card la variante est idéale pour des blocs discrets de contenu nécessitant une attention individuelle, tels que des profils, des descriptions de produits ou des éléments interactifs. C'est un excellent choix pour créer une grille visuellement attrayante d'options ou de blocs d'information, où chaque carte contient un élément de contenu faisant partie d'une collection plus large. Cette variante est particulièrement efficace dans les conceptions réactives, car les cartes peuvent se réorganiser élégamment selon les tailles d'écran.

Résumé

Choisir la bonne Variante pour l'Avonni Container revient à assortir le style du conteneur à l'objectif de votre contenu et à l'esthétique globale de votre page. Que vous optiez pour la simplicité dépouillée de standard, les limites définies de box, ou l'attrait moderne de card, chaque option offre une manière unique d'encadrer et de mettre en valeur votre contenu dans l'environnement Salesforce Experience Cloud

Nom

Description

Utilisation

Espacement intérieur (Padding)

Ajustez l'espacement interne du conteneur.

Définissez les valeurs de padding pour garantir que le contenu du conteneur ait un espacement approprié par rapport aux bords, améliorant la lisibilité et l'esthétique.

Taille

Configurez les dimensions du conteneur et le comportement du dépassement de contenu.

Définissez des valeurs spécifiques de largeur et de hauteur et déterminez comment le conteneur doit gérer le contenu qui dépasse ses dimensions (overflow).

Arrière-plan

Personnalisez l'arrière-plan en définissant une couleur et en ajustant la taille et l'alignement de l'image de fond.

Configurez ces paramètres pour obtenir l'impact visuel souhaité et l'alignement de l'arrière-plan par rapport au contenu du conteneur.

Bordure

Définissez l'apparence de la bordure du conteneur.

Personnalisez la bordure en sélectionnant sa taille, son style, sa couleur et le rayon des coins, en veillant à ce qu'elle complète le design global du conteneur.