Cliquer-dérouler

Le cliquer-dérouler permet à l'internaute d'avoir une vision synthétique de la page et d'accéder directement au contenu qui l'intéresse.

Il existe deux widgets de cliquer-dérouler :

  • Cliquer-dérouler avec éditeur de texte avancé
    • avantage : permet de créer rapidement plusieurs cliquer-dérouler en utilisant un seul widget
    • inconvénient : seul un contenu de type texte est proposé (images sans habillage)
  • Cliquer-dérouler avec insertion de tout type de contenu
    • avantages :
      • différents widgets peuvent y être insérés (Texte et médias, ce qui permet de cadrer l'image par rapport au texte, Contact, Télécharger, Galerie photo)
      • possibilité de mettre des cliquer-dérouler dans d'autres cliquer-dérouler
    • inconvénients :
      • la création se fait en 2 étapes : création du cliquer-dérouler (enregistrer et fermer le widget) puis insertion d'un autre widget à l'intérieur
      • il faut créer autant de widgets que de cliquer-dérouler nécessaires

Chaque cliquez-dérouler comporte un titre cliquable dont vous devez choisir le niveau : pour être compatible avec les logiciels d'accessibilité pour les personnes malvoyantes, vous devez définir le titre de votre cliquer-dérouler comme étant un titre de niveau 3 s'il est à l'intérieur d'un paragraphe de niveau 2.

Un cliquer-dérouler sans contenu est invisible : vous ne pouvez pas voir le titre cliquable (permettant d'ouvrir/fermer le bloc de texte) si celui-ci ne comporte aucun texte.

 

Lorem ipsum dolor sit amet (titre 3)

Consectetur adipisicing elit. At commodi ducimus error esse explicabo incidunt nobis non numquam. Alias, aliquid commodi dolor et harum hic quis quisquam quos repellendus vero. At esse expedita incidunt inventore ipsam nam, non odit officia rem, sunt ut veniam voluptatum?

At commodi ducimus

Alias, aliquid commodi dolor et harum hic quis quisquam quos repellendus vero. At esse expedita incidunt inventore ipsam nam, non odit officia rem, sunt ut veniam voluptatum?

Proin gravida nibh vel velit auctor aliquet. Aenean sollicitudin, lorem quis bibendum auctor, nisi elit consequat ipsum, nec sagittis sem nibh id elamet nibh vulputate cursus a sit amet mauris. Morbi1 accumsan ipsum velit.

Donec id Abréviation ligula. Donec définition nulla metus, aliquet Infobulle quis eleifend a, rutrum eget nisi. Maecenas condimentum sodales placerat. Donec elementum libero ac est dapibus hendrerit. Sed in dictum lorem. Integer congue erat diam. Aliquam turpis ex, congue non tempor non, porttitor id magna.

Ab ad animi Simple link assumenda aut beatae consequatur culpa cumque debitis delectus, external link deleniti dignissimos explicabo fugiat iure nihil officia provident, new window quam ullam veniam voluptas New window and external link voluptatum. 

Est do reprehenderit ex officia (titre 3)

Velit ea sunt ullamco veniam eu commodo mollit laboris. Est magna dolor anim minim proident deserunt. Velit dolore do ipsum laboris anim est ut aute mollit cupidatat non nisi.Est do reprehenderit ex officia tempor dolore cupidatat deserunt ipsum officia do magna. Velit ea sunt ullamco veniam eu commodo mollit laboris.

Est magna dolor anim

Minim proident deserunt. Velit dolore do ipsum laboris anim est ut aute mollit cupidatat non nisi. Lorem.

Est do reprehenderit ex officia tempor dolore cupidatat deserunt ipsum officia do magna. Velit ea sunt ullamco veniam eu commodo mollit laboris. Est magna dolor anim minim proident deserunt. Velit dolore do ipsum laboris anim est ut aute mollit cupidatat non nisi.Est do reprehenderit ex officia tempor dolore cupidatat deserunt ipsum officia do magna. Velit ea sunt ullamco veniam eu commodo mollit laboris. Est magna dolor anim minim proident deserunt. Velit dolore do ipsum laboris anim est ut aute mollit cupidatat non nisi. Lorem.

Lorem ipsum

Est do reprehenderit ex officia tempor dolore cupidatat deserunt ipsum officia do magna. Velit ea sunt ullamco veniam eu commodo mollit laboris. Est magna dolor anim minim proident deserunt. Velit dolore do ipsum laboris anim est ut aute mollit cupidatat non nisi.

 

Quis montes platea in scelerisque amet porta quis odio porta dis, turpis, elit et elementum sociis.

Egestas tempor porta ut? Dis ac et velit, aliquam hac sagittis. Mattis risus turpis et est montes elementum facilisis facilisis porttitor nascetur turpis porta turpis sociis! Lectus pellentesque, augue, vel turpis, integer, nascetur elementum! Penatibus natoque purus eu, lundium mauris magnis lacus eu hac! Lectus nisi tortor hac, duis urna, augue tortor. Magna nec! In hac, adipiscing ultrices nunc, proin? Auctor, sed ut tincidunt? Mid magnis parturient tincidunt, tincidunt dapibus nunc tincidunt, enim urna urna amet quis augue scelerisque, tincidunt a? Dolor, ut nec, vel elementum scelerisque egestas? Montes! A integer urna, in cursus! Sit cras est mid lundium nisi etiam nascetur aliquet pulvinar.

 

Pid rhoncus, facilisis ultricies facilisis? Augue tempor, montes scelerisque.

Porttitor pellentesque massa eros auctor, habitasse vel dapibus, purus cum. Aenean nisi aenean? Adipiscing. Magnis rhoncus diam! Integer. Hac mauris. Augue penatibus arcu mauris urna habitasse, etiam phasellus hac facilisis dis proin est in purus! Magna in turpis. Pulvinar auctor? Arcu. Non? Nisi eu? Habitasse. Odio porttitor? In nisi tincidunt. Pid pid dictumst, risus augue egestas porta tortor tincidunt amet, vut cras adipiscing hac sit? Penatibus! Cum scelerisque egestas integer pulvinar etiam hac a nascetur tincidunt a facilisis, risus aliquet? Parturient sed natoque rhoncus elementum pulvinar ut, sed diam, cursus in a ut vel vut? Dictumst aliquet auctor sagittis ac. Sed? Nunc? Integer porttitor! Sed mid, integer in, integer! In.

Quis montes platea in scelerisque amet porta quis odio porta dis, turpis, elit et elementum sociis.

Egestas tempor porta ut? Dis ac et velit, aliquam hac sagittis. Mattis risus turpis et est montes elementum facilisis facilisis porttitor nascetur turpis porta turpis sociis! Lectus pellentesque, augue, vel turpis, integer, nascetur elementum! Penatibus natoque purus eu, lundium mauris magnis lacus eu hac! Lectus nisi tortor hac, duis urna, augue tortor. Magna nec! In hac, adipiscing ultrices nunc, proin? Auctor, sed ut tincidunt? Mid magnis parturient tincidunt, tincidunt dapibus nunc tincidunt, enim urna urna amet quis augue scelerisque, tincidunt a? Dolor, ut nec, vel elementum scelerisque egestas? Montes! A integer urna, in cursus! Sit cras est mid lundium nisi etiam nascetur aliquet pulvinar.

Pid rhoncus, facilisis ultricies facilisis? Augue tempor, montes scelerisque.

Porttitor pellentesque massa eros auctor, habitasse vel dapibus, purus cum. Aenean nisi aenean? Adipiscing. Magnis rhoncus diam! Integer. Hac mauris. Augue penatibus arcu mauris urna habitasse, etiam phasellus hac facilisis dis proin est in purus! Magna in turpis. Pulvinar auctor? Arcu. Non? Nisi eu? Habitasse. Odio porttitor? In nisi tincidunt. Pid pid dictumst, risus augue egestas porta tortor tincidunt amet, vut cras adipiscing hac sit? Penatibus! Cum scelerisque egestas integer pulvinar etiam hac a nascetur tincidunt a facilisis, risus aliquet? Parturient sed natoque rhoncus elementum pulvinar ut, sed diam, cursus in a ut vel vut? Dictumst aliquet auctor sagittis ac. Sed? Nunc? Integer porttitor! Sed mid, integer in, integer! In.

Est do reprehenderit ex officia tempor dolore cupidatat deserunt ipsum officia do magna. Velit ea sunt ullamco veniam eu commodo mollit laboris. Est magna dolor anim minim proident deserunt. Velit dolore do ipsum laboris anim est ut aute mollit cupidatat non nisi.Est do reprehenderit ex officia tempor dolore cupidatat deserunt ipsum officia do magna. Velit ea sunt ullamco veniam eu commodo mollit laboris. Est magna dolor anim minim proident deserunt. Velit dolore do ipsum laboris anim est ut aute mollit cupidatat non nisi. Lorem.

Lorem ipsum

Est do reprehenderit ex officia tempor dolore cupidatat deserunt ipsum officia do magna. Velit ea sunt ullamco veniam eu commodo mollit laboris. Est magna dolor anim minim proident deserunt. Velit dolore do ipsum laboris anim est ut aute mollit cupidatat non nisi.

 

Est do reprehenderit ex officia tempor dolore cupidatat deserunt ipsum officia do magna. Velit ea sunt ullamco veniam eu commodo mollit laboris. Est magna dolor anim minim proident deserunt. Velit dolore do ipsum laboris anim est ut aute mollit cupidatat non nisi.Est do reprehenderit ex officia tempor dolore cupidatat deserunt ipsum officia do magna. Velit ea sunt ullamco veniam eu commodo mollit laboris. Est magna dolor anim minim proident deserunt. Velit dolore do ipsum laboris anim est ut aute mollit cupidatat non nisi. Lorem.

Lorem ipsum

Est do reprehenderit ex officia tempor dolore cupidatat deserunt ipsum officia do magna. Velit ea sunt ullamco veniam eu commodo mollit laboris. Est magna dolor anim minim proident deserunt. Velit dolore do ipsum laboris anim est ut aute mollit cupidatat non nisi.