Les styles personnalisés applicables aux lignes s'enrichissent d'un nouveau style nommé "Accordéon". Cet effet, que vous avez peut-être déjà utilisé sur les widgets de vos menus verticaux est désormais applicable à toutes vos pages web conçues à l'aide de l'outil de création de pages.
- Créer un site
- Blog sur la création de site
- Web design
- Un effet accordéon sur les lignes
Application du style
Comme pour les autres styles personnalisées applicables aux lignes, vous retrouverez cet effet dans le menu déroulant "Style", situé en bas à gauche de l'outil de création de pages.
Exemple d'utilisation
Sur une page produit de votre boutique, vous pouvez appliquer le style "Accordéon" à plusieurs lignes contenant chacune d'elles des informations complémentaires sur votre article, comme l'illustre l'exemple ci-dessous :
Dans cet exemple, deux lignes ont été ajoutées, ayant respectivement pour titre "Détails du produit" puis "Matière et entretien". Le style "Accordéon" a ensuite été appliqué à chacune d'elles. Cliquer sur le titre d'une ligne aura pour effet d'en afficher le contenu ou de le masquer s'il est visible. Deux lignes ne peuvent être affichées simultanément, l'affichage d'une ligne cachera automatiquement le contenu de toutes les lignes sur lesquelles le style "Accordéon" est appliqué.
Avantages
Le premier avantage est un allègement du contenu de vos pages. Vous masquez des informations que vous considérez secondaires, laissant le choix à l'internaute de les afficher ou non.
Le second avantage est que vous réduisez ainsi la hauteur de vos pages, ce qui n'est pas négligeable, notamment lors d'une consulation de votre site internet depuis un terminal mobile.
Enfin, vous apportez de l'animation dans vos pages, les rendant ainsi plus modernes.
Forcer l'ouverture d'une ligne au chargement de la page
Peut-être souhaiterez-vous que le contenu d'une ligne soit affiché par défaut ? Dans ce cas, il va vous falloir ajouter deux classes CSS sur la ligne concernée :
- Dans le menu déroulant "Style", choisissez "Avancé".
- Dans le champ "class" qui apparaît, saisissez alors les noms "row-panel" puis "open", séparé d'un espace.
La classe "open", combinée à la classe "row-panel", permet ainsi de forcer l'ouverture de la ligne au chargement de la page.
Ce style ne concerne que les thèmes responsive, conçus à partir des frameworks Bootstrap et EMS Framework.
Articles similaires

Aller plus loin dans la personnalisation de la page d'erreur 404 de son site Internet
Le mercredi, 20 octobre 2021
Encore une nouveauté sur e-monsite : cette fois-ci, pour aller plus loin dans la personnalisation de la page d'erreur 404 de son site Internet.
La page d'erreur 404 indique à l'internaute que votre page web n'existe pas ou plus. Avec e-monsite, vous pouvez personnaliser la page 404 par défaut. Et désormais, vous pouvez ajouter davantage de contenu dynamique, pour créer une page d'erreur 404 créative et originale. On vous dit tout sur cette nouveauté pour créer une page d'erreur 404 personnalisée.

Créer une page 404 personnalisée
Le lundi, 18 août 2014
La page d'erreur 404 s'affiche quand l'internaute arrive sur une page de votre site web qui n'existe pas (ou plus). Si vous avez choisi e-monsite pour créer un site, vous disposez d'une page 404 par défaut, que vous pouvez personnaliser. Voici quelques explications sur cette page spéciale: des conseils pour éviter les erreurs et la méthode pour personnaliser la page 404.