Documentation en français du builder Oxygen

Onglets

L’élément Tabs vous permet d’ajouter des onglets à vos conceptions. Cliquer sur un onglet affichera le contenu associé à cet onglet. Le contenu associé aux autres onglets sera masqué.

Ajouter Tabs

Pour ajouter un élément Tabs à votre page, cliquez sur +Add > Helpers > Tabs.

Structure des onglets

Un élément Tabs se compose de deux parties : les Onglets en eux-mêmes et une zone de contenu propre à chaque onglet, respectivement Tabs et Tabs Contents dans le panneau Structure.

Par exemple, un clic sur le premier onglet affichera le contenu affecté à ce premier onglet. Un clic sur le cinquième onglet affichera le contenu affecté à ce cinquième onglet, etc.

Tout type d’éléments peut être placé dans un onglet ou sa zone de contenu. Par défaut, des éléments Text sont placés à l’intérieur de chaque onglet et de leur zone de contenu respective, mais ils peuvent être supprimés et remplacés…

Ajout et Suppression d’un onglet ou d’un contenu d’onglet

Pour ajouter un autre onglet ou contenu d’onglet, cliquez simplement sur un élément existant d’onglet ou de contenu d’onglet et dupliquez-le.

Vous pouvez également sélectionner l’élément Tabs et utiliser le bouton Ajouter un onglet pour ajouter un autre onglet. Cela ajoutera aussi automatiquement un autre élément Tab Content.

Remarque : la suppression d’un onglet ne supprime pas la zone de contenu associée.

Stylage des Onglets

Oxygen crée automatiquement une classe CSS et l’ajoute à tous les éléments de l’onglet, ainsi qu’une classe active qui ne sera appliquée qu’au dernier onglet cliqué.

Pour styler tous les éléments de l’onglet en même temps, cliquez sur un onglet, puis choisissez la classe tabs-****-tab. Les styles appliqués à cette classe seront appliqués à tous les éléments de l’onglet.

Pour styler uniquement l’onglet actif, cliquez sur un onglet, puis choisissez la class onglets tabs-****-tab-active. Les styles appliqués à cette classe ne seront appliqués qu’à la classe active.

Pour mettre en forme vos onglets, les éléments à l’intérieur d’un onglet ou les éléments à l’intérieur du contenu d’onglets, vous pouvez utiliser tous les réglages habituels d’Oxygen.

Ph. Reskator

Besoin d’un complément d’information ? Retrouvez-nous sur le groupe de soutien
linkedin facebook pinterest youtube rss twitter instagram facebook-blank rss-blank linkedin-blank pinterest youtube twitter instagram