Tab view vous offre un moyen simple d'afficher le contenu de plusieurs pages sur une seule en utilisant des onglets (tabs). C'est un moyen attractif et utile pour afficher et organiser du contenu.
Pour une extension similaire qui ne nécessite pas plusieurs pages, consultez Tabber.
L'utilisation de TabView est limitée car Fandom a l'intention de mettre fin à l'extension. Il est fortement suggéré que vous n'ajoutiez pas de code TabView supplémentaire dans votre wiki et l'activation de la fonctionnalité ne peux plus être demandé.
Pas à pas[]
- Premièrement, vous devez créer une page pour chaque onglet afin d'y mettre leur contenu respectif. Ces pages peuvent être créées n'importe où sur la communauté.
- Dans cet exemple, nous avons créé trois sous-pages à cette page, que nous allons mettre dans le tabview ci-dessous. Ces pages sont :
- Ouvrez la page dans laquelle vous voulez voir apparaître ces pages et passez en mode source.
- Saisissez le code de votre tabview comme suit :
<tabview> NomdelaPage1|TITRE1 NomdelaPage2|TITRE2 NomdelaPage3|TITRE3 </tabview>
Avec notre exemple, nous allons donc saisir :
<tabview> Aide:Tab View/Exemple 1|Onglet 1 Aide:Tab View/Exemple 2|Onglet 2 Aide:Tab View/Exemple 3|Onglet 3 </tabview>
Cela nous donnera les onglets suivants :
Personnalisation[]
En plus du titre, il y a deux autres variables que vous pouvez personnaliser dans vos onglets : cache et ouvert par défaut. Ils sont configurable dans cet ordrenbsp;:
<tabview> NOM DE LA PAGE|TITRE|CACHE|OUVERT PAR DÉFAUT </tabview>
Désactiver le cache des onglets[]
Si la page montre des informations mises à jour très régulièrement, vous voudrez peut-être forcer l'onglet à récupérer le contenu de la page à chaque chargement. Cela peut être fait avec un | suivi de false. Cela doit être utilisé à bon escient car cela peut diminuer l'expérience de lecture globale. Par défaut, cette option est à « true ».
<tabview> Aide:Tab View/Exemple 1|Onglet 1|false Aide:Tab View/Exemple 2|Onglet 2 Aide:Tab View/Exemple 3|Onglet 3 </tabview>
Cela vous donnera :
Ouvrir un onglet par défaut[]
La dernière variable choisit quel onglet est ouvert par défaut au chargement de la page. Par défaut, le premier onglet est ouvert mais vous pouvez choisir d'en ouvrir un autre en utilisant une troisième barre verticale suivie du mot « true ».
<tabview> Aide:Tab View/Exemple 1|Onglet 1 Aide:Tab View/Exemple 2|Onglet 2||true Aide:Tab View/Exemple 3|Onglet 3 </tabview>
Cela vous donnera :
Paramètres[]
Les seuls paramètres disponibles pour tabview sont « title » et « id ». Vous ne pouvez pas personnaliser chaque tabview d'une page en utilisant du wikitexte ; cela doit être fait via le CSS du wiki. Les paramètres sont :
<tabview title="…" id="…">
Style[]
Avec le paramètre "id" en place, vous pouvez personnaliser chaque onglet. Exemple :
ul.tabs > [data-tab="flytabs_Example0"] {
/* Les règles CSS pour data-tab="flytabs_Example0" (premier onglet) apparaissent ici */
}
ul.tabs > [data-tab="flytabs_Example1"] {
/* Les règles CSS pour data-tab="flytabs_Example1" (deuxième onglet) apparaissent ici */
}
ul.tabs > [data-tab="flytabs_Example2"] {
/* Les règles CSS pour data-tab="flytabs_Example2" (dernier onglet) apparaissent ici */
}
Les onglets eux-même apparaîtront dans une balise <div> avec l'« id » « flytabs_Example » et leur contenu sera placé dans un <div> à part avec l'id « flytabs_Example-content-wrapper ».
Problèmes[]
Expérience mobile[]
Sur les appareils mobiles, les pages indiquées sont présentées sous forme de liste de liens plutôt que d'onglets. Cela s'explique par le fait que les expériences par onglets sont difficiles à utiliser sur les appareils mobiles.
Voir/modifier le contenu des onglet[]
Tab view ne fournit pas un moyen simple de voir/modifier la page originale. Cela peut être gênant pour les utilisateurs inexpérimentés qui souhaitent modifier le contenu à l'intérieur d'un onglet. Comme l'onglet est en fait un élément lien, un utilisateur pourrait faire un clic droit dessus et cliquer sur « ouvrir » pour suivre manuellement le lien. Cependant, il existe un script sur le Wiki Dev de Fandom appelé TabViewEditLinks qui ajoute les liens d'édition.
Imbrication des onglets[]
Tabview ne gère pas correctement les onglets imbriqués. En d'autres termes, les pages que vous incluez dans vos onglets ne peuvent pas avoir leur propre section tabview. Le lecteur commencera à rencontrer ce problème lorsqu'il ouvrira un onglet qui contient une autre section à onglets. Bien que les spécificités de ce problème semblent incohérentes, le problème général est que le contenu du premier onglet sera affiché, suivi du contenu de l'onglet prévu. Un autre problème est que les onglets imbriqués seront affichés sous la forme d'une liste à puces de liens au lieu d'onglets.
Une fois que cela s'est produit, le contenu de l'onglet en question s'affichera à la fin de chacun des autres onglets. En retournant à l'onglet en question, il est possible d'ajouter une autre copie du contenu de l'onglet à la fin lorsque l'on consulte les autres onglets. Par exemple, supposons que nous incluons une 4ème page (comme « Onglet 4 ») qui a sa propre section à onglets. Lorsque le lecteur ouvrira l'« Onglet 4 », il verra le contenu de l'« Onglet 1 » suivi du contenu de l'« Onglet 4 ». S'il navigue vers l'« Onglet 3 », il verra maintenant le contenu de l'« Onglet 3 » suivi du contenu de l'« Onglet 4 ». S'ils naviguent à nouveau vers l'« Onglet 4 » puis vers l'« Onglet 2 », ils verront le contenu de l'« Onglet 2 » suivi de deux copies du contenu de l'« Onglet 4 ».
Si vous souhaitez avoir des onglets imbriqués, vous devrez utiliser tabber au lieu de tabview.
Moteur de recherche[]
Comme une page utilisant Tabview doit utiliser JavaScript pour extraire d'autres pages et les insérer ailleurs, les résultats peuvent ralentir la performance de l'indexation par les moteurs de recherche. En outre, le même contenu de page est affiché dans plusieurs pages de résultats.
Balises include[]
Tabview ne permet pas d'extraire le contenu d'une page. Ainsi, la page originale sera affichée et des éléments tels que le wikitexte incluent des balises (<includeonly>, <noinclude>, et <onlyinclude>) afficheront le même contenu que la page source.
Voir aussi[]
Plus d'aide
- Parcourez et recherchez d'autres pages d'aide sur Aide:Contenu
- Visitez le Centre des communautés pour plus d'aide
- Consultez Aide:Contacter Fandom pour savoir comment signaler des erreurs ou des points à éclaircir sur cet article