Ce script utilise JavaScript mais se comporte bien en cas de désactivation. De plus il place un cookie de sorte qu’au retour sur la page, il s’ouvre sur l’onglet que vous avez quitté ;-)
Vous pouvez mettre ce que vous voulez dans le contenu, texte, image, vidéo...
Pour SPIP à partir de version 1.9.1
Installation
Décompressez l’archive onglets_texte_1.9.1.zip et placez le dossier obtenu dans le dossier plugins/ à la racine de votre site (créez le s’il n’existe pas).
- plugin onglets_texte_1.9.1.zip
Activez le plugin dans la partie privée.
Utilisation
A la rédaction du texte de votre article procédez comme suit :
Utilisation dans le squelette
Je vous livre à titre d’exemple ce script qui m’a été demandé par un utilisateur. Il affichera les différentes traductions de votre article, l’onglet s’ouvrira dans la langue courante, SPIP c bô...
Un autre tableau dans le texte ? Précisez juste une id dans le premier onglets :
Pointer directement vers un onglet
En mettant un id à un onglet (<div id="toto" class="tab-page"> par exemple), il suffit d’ajouter l’ancre de même nom à l’URL pour que l’onglet soit automatiquement sélectionné (example.com/article42.html#toto par exemple).
Personnalisation
Par défaut les onglets ont une taille fixe de 70 pixels. Vous pouvez changer celà dans la feuille de style, il vous faudra ajuster aussi les images.
Vous pouvez aussi décider de tailles variant avec la longueur de titre de l’onglet, pour celà utilisez la feuille de style fournie ici, enregistrez la dans votre dossier squelettes/css
- css onglets taille variable
Have fun ;-)
Cet article est une adaptation du script d’Erik Arvidsson que vous pouvez voir en ligne ici
F.A.Q :
J’ai bien tout fait mais rien ne se passe ! ;-(
Vérifiez que la balise #INSERT_HEAD est bien présente dans vos squelettes. Elle est indispensable au fonctionnement des plugins. A partir de la version 1.9 de SPIP, cette balise est en standard dans le fichier inc-head.html appelé dans le header de tous les squelettes.
Reproduisez ce principe sur votre site, placez vos css et vos javascripts dans ce fichier vous gagnerez du temps...
plugin onglets_texte_1.9.1.zip
css onglets taille variable
Vos commentaires
# Le 10 février à 09:49, par Martin
En réponse à : En onglets dans le texte de SPIP, ou ailleurs...
Sauf erreur de ma part, les onglets ont une taille fixe, et il n’est pas facile de la modifier. Ça limite pas mal l’intérêt du plugin, non ? Chez moi le titre des articles est coupé, du coup on comprend pas sur quoi on va cliquer. Comment vous faites, vous ?
Répondre à ce message
# Le 29 décembre 2011 à 15:09, par Fred
En réponse à : En onglets dans le texte de SPIP, ou ailleurs...
Bonjour,
j’ai installé le plugins, j’ai vérifé que la balise #INSERT_HEAD était bien présente dans mon squelette,
mais je n’ai pas d’onglet. Voici ma page :
http://www.picardie-1939-1945.org/article29.html
et voici ce que j’ai mis suivant ce qui est indiqué sur ce tutoriel :
... onglet|debut|titre=accueil ...
contenu du premier onglet
...onglet|titre=Infos...
contenu du deuxième onglet
... onglet|titre=Mises à jour ...
contenu du troisième onglet
Que se passe-t-il ? que n’ai-je pas compris ? que n’ai-je pas fait. Merci de votre aide
Fred
# Le 29 décembre 2011 à 17:11, par ?
En réponse à : En onglets dans le texte de SPIP, ou ailleurs...
heuuu, avant tout, il me semble qu’il y a un drapeau indésirable sur votre site....
# Le 29 décembre 2011 à 18:59, par Fred
En réponse à : En onglets dans le texte de SPIP, ou ailleurs...
Avant tout , je disais « bonjour ».
Ce drapeau en quoi vous gêne-t-il ? C’est le drapeau des forces allemandes pendant la 2nde GM. C’est une réalité historique et non de propagande. Les personnes qui écrivent sur ce site, sont des historiens, clairement identifiés et ne se cachent pas. Nous sommes là pour raconter ce qui s’est passé, pas pour faire de la politique. Lisez quelque peu le contenu du site, avant de dire des sottises.
Mais jeune homme ou jeune fille, je ne viens pas vous donner une leçon d’histoire alors je ne viens pas chercher une leçon de morale. si vous pouvez m’aider, merci, sinon tant pis.
cordialement
Fred
# Le 29 décembre 2011 à 19:08, par ?
En réponse à : En onglets dans le texte de SPIP, ou ailleurs...
bonsoir, il me semblait que c’était juste interdit, me trompe je ?
# Le 29 décembre 2011 à 20:20, par Fred
En réponse à : En onglets dans le texte de SPIP, ou ailleurs...
bonsoir,
pas davantage que sur ce site là : http://fr.wikipedia.org/wiki/Drapeau_de_l’Allemagne#L.27Allemagne_nazie
LE drapeau, utilisé sur notre site n’est utilisé qu’à des fins historiques et même pédagogiques. Nous avons déjà travaillé avec des scolaires. Lors de nos expositions, nous de dissimulons aucun signe. Nos visiteurs quand ils lisent nos panneaux et écoutent nos conférences savent à qui ils ont à faire.
Si tu as pris le temps de visiter le site, tu as peux être pu t’en rendre compte.
Maintenant que je me suis justifié, puis avoir un coup de main ? :-)
# Le 30 décembre 2011 à 00:37, par ?
En réponse à : En onglets dans le texte de SPIP, ou ailleurs...
re, vous avez sans doute raison, (tiens la page dont vous parlez est vidée actuellement....). j’ai été choqué dans une exposition récente au musée du jeu de Paume de deux photographes contemporains, par une image esthétisante représentant un officier nazzi, et aussi par un récent séjour en allemagne de l’est, des manifestations qui font peur.. Mais bon ce n’est pas le sujet, je vous l’accorde.
En ce qui concerne votre problème,
Le plugin est bien acivé ? Avez vous essayé de désactiver le compression js dans l’espace privé
ou bien d’appeler le js en dur avant la balise comme
<script type="application/javascript" src="[(#CHEMIN{javascript/mes_onglets.js})]"></script>après la balise #INSERT_HEAD _ ?
# Le 30 décembre 2011 à 10:09, par Fred
En réponse à : En onglets dans le texte de SPIP, ou ailleurs...
Bonjour,
non la page n’est pas vide, c’est le forum de Spip qui bouffe le la longueur du lien ;-)
Voilà la page : http://fr.wikipedia.org/wiki/Drapeau_de_l’Allemagne
Merci pour votre aide. Oui plugin activé, bien sur, par contre pour la suite, va falloir que je mette les mains dans le cambouis et là ce n’est pas mon fort ... :-( Je vais essayer. Merci
Répondre à ce message
# Le 11 mai 2011 à 18:00, par fd
En réponse à : En onglets dans le texte de SPIP, ou ailleurs...
Alors il y a un bug avec ce plugin et le mix champs extra/conditions.
n effet le problème viens aussi du mix champs extra - onglets - conditions.
Ce code :
[(#POURQUOI|?{'
<div class="tab-page">
<h2 class="tab">Pourquoi </h2>
#POURQUOI
<ul class="liste-articles">
<BOUCLE_articlespourquoi(ARTICLES){id_rubrique}{titre_mot=Pourquoi Prologiq}{par date}>
<li><a href="#URL_ARTICLE">[(#TITRE|supprimer_numero)]</a></li>
</BOUCLE_articlespourquoi>
</ul>
</div>
',''})]
devrait créer un onglet si le champs extra POURQUOI contient qq chose, sinon rien.
Ce code ne fonctionne que sil ne contient pas un inclure ou une autre boucle(comme ci-dessus) permettant d’afficher par ex des articles.
En gros impossible de créer cette condition :( Une solution ?
# Le 11 mai 2011 à 18:15, par Patrice Vanneufville
En réponse à : En onglets dans le texte de SPIP, ou ailleurs...
Pourquoi tu romps le fil de conversation ? As-tu essayé ce que je propose plus bas :
[(#POURQUOI|oui) blablabla]Maintenant si tu vx mettre une boucle à l’intérieur de ta condition, utilise plutôt un inclure :
[(#POURQUOI|oui) <INCLURE{ ... }>]voire :
[(#POURQUOI|oui) [(#INCLURE{ ... })]]A lire :
- http://www.spip.net/fr_article1828.html (doc officielle)
- http://www.armetiz.info/simple-cond... (astuce sur une boucle feinte)
- http://spipotoulouse.org/spip.php?a... (un peu ancien : n’utilise pas les filtres |oui et |non)
# Le 12 mai 2011 à 13:37, par fd
En réponse à : En onglets dans le texte de SPIP, ou ailleurs...
Excuse moi le premier message ne s’est affiché que qq heures après contrairement au dernier ! Tu peux le supprimer ! Ce que tu m’as montré ne fonctionne pas !
La réponse m’a été donnée par Beurt que je remercie et la voici :
Répondre à ce message
# Le 11 mai 2011 à 17:29, par fd
En réponse à : En onglets dans le texte de SPIP, ou ailleurs...
Ce plugin magnifique me crèe un bug avec les inclusions et les champs extra :(
Je désire créer une boucle avec des champs extra et deux niveaux de conditions.
Première condition : si le champs extra(oui/non) PRESENTATION est sur
- oui (m’afficher une présentation à onglets,
- sinon n’afficher que le texte de la rubrique)
Deuxième condition : Les onglets sont générés à partir de champs extra.
N’afficher un onglet que lorsque le champs extra contient de l’information, sinon pas d’onglet.
Eh bien impossible à réaliser :(
Code de base :
[(#PRESENTATION|?{
<div class="tab-pane" id="xx">
<div class="tab-page">
<h2 class="tab">Premier onglet</h2>
texte premier onglet, ca marche
</div>
[REM condition :si champs nest pas vide, création de l'onglet]
[(#POURQUOI|?{'
<div class="tab-page">
<h2 class="tab">Pourquoi </h2>
#POURQUOI
<INCLURE{fond=pourquoi}{id_rubrique}></div>
',''})]
</div>
</div>, ''})]
Résultat : il m’affiche dans l’onglet la balise #POURQUOI !!!! au lieu de m’afficher le contenu du champs et bien entendu pas d’articles en dessous !!
Si je modifie la partie de l’onglet-condition « pourquoi » de cette façon (avec paranthèse et crochet autour du nom du champs) :
[(#POURQUOI)]il m’affiche ceci sur le site (et tj pas la liste d’articles !) : %##11@ (bizarre...)
Si par contre je ne fais pas d’inclure de cette façon :
<div class="tab-page">
<h2 class="tab">Pourquoi </h2>
#POURQUOI
<ul class="liste-articles">
<BOUCLE_articlespourquoi(ARTICLES){id_rubrique}{titre_mot=Pourquoi Prologiq}{par date}>
<li><a href="#URL_ARTICLE">[(#TITRE|supprimer_numero)]</a></li>
</BOUCLE_articlespourquoi>
</ul></div>
Là le système d’onglets et leur contenu fonctionne, par contre c’est du code de ce genre qui s’affiche autour du cadre [(oui| ? .... comme si la condition principale ne fonctionnait plus et s’affichait.
J’ai également essayé d’enlever la condition principale qui affiche ou moins les onglets mais là aussi ca foire...
D ou pourrait venir le soucis ?
# Le 11 mai 2011 à 17:47, par Patrice Vanneufville
En réponse à : En onglets dans le texte de SPIP, ou ailleurs...
Salut. Et si tu simplifiais un peu ? Du genre :
[(#PRESENTATION|oui) blablabla !!][(#PRESENTATION|non) blablabla !!]
Par contre, je ne suis pas sûr qu’on puisse intégrer une boucle dans une struture comme celle-là... Il faut probablement passer par l’inclusion d’une noisette ;-)
Répondre à ce message
# Le 15 avril 2011 à 18:41, par tetue
En réponse à : En onglets dans le texte de SPIP, ou ailleurs...
Je découvre ce plugin, pas mal du tout !
Par contre, la structure générée n’est pas correcte, puisque les onglets sont constitués par des titres h2 successifs (mieux vaudrait une liste ul li), désolidarisés du contenus auquel ils correspondent !
La structure suivante serait plus appropriée :
<div class="tabs-bloc">
<div class="tabs">
<ul>
<li class="tab tab1 on"><a href="#tab1">Onglet 1</li>
<li class="tab tab2"><a href="#tab2">Onglet 2</li>
<li class="tab tab3"><a href="#tab3">Onglet 3</li>
</ul>
</div>
<div class="tab-page on" id="tab1">
<h2 class="none">Onglet 1</h2>
<p>lorem ipsum</p>
<ul class="spip">
<li>liste</li>
<li>liste</li>
<li>liste</li>
</ul>
</div><!--#tab1-->
<div class="tab-page none" id="tab2">
<h2 class="none">Onglet 3</h2>
<h3>toto</h3>
<p>bla bla bla</p>
<h3>toto</h3>
<p>bla bla bla</p>
</div><!--#tab2-->
<div class="tab-page none" id="tab3">
<h2 class="none">Onglet 3</h2>
<p>lorem ipsum</p>
<ul class="spip">
<li>liste</li>
<li>liste</li>
<li>liste</li>
</ul>
</div><!--#tab3-->
</div>
Répondre à ce message
# Le 12 mars 2011 à 19:12, par fd
En réponse à : En onglets dans le texte de SPIP, ou ailleurs...
Magnifique !! Merci !!
J’ai pu faire la pagination de mes articles par année en onglets :)
<div class="tab-pane" id="xx">
<BOUCLE1(ARTICLES){par date}{id_rubrique}{inverse}{fusion YEAR(date)}{tout}>
<div class="tab-page">
<h2 class="tab">[(#DATE|annee)]</h2>
<BOUCLE2(ARTICLES){id_rubrique}{annee_relatif}{par date}{inverse}>
<a href="#URL_ARTICLE">[(#TITRE|supprimer_numero)]</a><br /></BOUCLE2>
</div></BOUCLE1>
</div>
Répondre à ce message
# Le 17 janvier 2011 à 17:22, par Nicolas Hoizey
En réponse à : En onglets dans le texte de SPIP, ou ailleurs...
Utilisant ce plugin, j’aimerais donner la possibilité aux rédacteur de pointer directement vers l’onglet de leur choix dans les URL, avec une ancre.
Il « suffirait » que le plugin détecte une ancre dans l’URL, et rende automatiquement actif l’onglet ayant l’id correspondant.
Est-ce envisageable ?
# Le 17 janvier 2011 à 18:53, par Pi r
En réponse à : En onglets dans le texte de SPIP, ou ailleurs...
waoo 5 ans déjà....
salut nicolas,, la question avait été posée à l’époque mais n’avait pas trouvé de soluce, désolé
# Le 19 janvier 2011 à 09:11, par Patrice Vanneufville
En réponse à : En onglets dans le texte de SPIP, ou ailleurs...
Une piste : Découper un texte en pages et/ou en onglets ;-)
# Le 19 janvier 2011 à 09:35, par Nicolas Hoizey
En réponse à : En onglets dans le texte de SPIP, ou ailleurs...
Tu veux vraiment que je réponde, Patrice ?
# Le 19 janvier 2011 à 09:42, par Nicolas Hoizey
En réponse à : En onglets dans le texte de SPIP, ou ailleurs...
Pierre, j’ai fait ce qu’il faut, mais je ne vois pas le plugin sur la zone, comment puis-je ajouter mon code ?
# Le 19 janvier 2011 à 10:00, par Pi r
En réponse à : En onglets dans le texte de SPIP, ou ailleurs...
salut nicolas, heu j’ai pas d’accès à la zone, je m’en occupe aujourd’hui ou bien tu postes ?
# Le 19 janvier 2011 à 10:10, par Nicolas Hoizey
En réponse à : En onglets dans le texte de SPIP, ou ailleurs...
Si tu veux, je l’ajoute à la zone. Tu peux m’ajouter comme auteur de cet article, que je complète la doc, du coup ?
# Le 19 janvier 2011 à 10:26, par Pi r
En réponse à : En onglets dans le texte de SPIP, ou ailleurs...
c fait, et merci et bravo pour le boulot ! ;)
# Le 19 janvier 2011 à 17:54, par Nicolas Hoizey
En réponse à : En onglets dans le texte de SPIP, ou ailleurs...
J’ai vu que tu as demandé un compte pour la zone, donc finalement tu ajoutes ton code et je me contente de modifier ensuite ?
J’ai déjà créé le dossier :
svn://zone.spip.org/spip-zone/_plugins_/onglets_texte# Le 19 janvier 2011 à 19:20, par Pi r
En réponse à : En onglets dans le texte de SPIP, ou ailleurs...
fait, waoo que 5 minutes pour piger comment comiter, balaise tortoise, merci Nicolas
# Le 19 janvier 2011 à 23:58, par Nicolas Hoizey
En réponse à : En onglets dans le texte de SPIP, ou ailleurs...
Et voilà, c’est ajouté :
http://zone.spip.org/trac/spip-zone/changeset/43676
Répondre à ce message
# Le 21 avril 2010 à 18:27, par Eric
En réponse à : En onglets dans le texte de SPIP, ou ailleurs...
Bonjour
Débutant sur spip 2.0.10, j’utilise sarka spip 3.0.2.
Je découvre les onglets qui me permettrai d’avoir des articles moins long.
voir un article d’essai sur mon site avec onglet ici
ma question : pour avoir des onglets et des fonds de pages sur le même thème que mon site, ou je vais trouver le fichier css et ou je doit le mettre ensuite ?
Merci de votre aide et de toutes les améliorations que vous nous apportez.
Cordialement
Eric
Répondre à ce message
# Le 25 mars 2010 à 13:10, par ?
En réponse à : En onglets dans le texte de SPIP, ou ailleurs...
Problème résolu :
pb de clic sur les onglets sous IE 7 (et pas sous Mozilla FF)
Solution simple :
enlever la ligne :
« cursor : default ; »
du css.tab
En espérant en avoir aidé d’autres.
Répondre à ce message
# Le 29 décembre 2009 à 19:10, par ?
En réponse à : En onglets dans le texte de SPIP, ou ailleurs...
bonjour,
j’ai installé le plugin sous spip 2.0
Il est idéal pour le site que je créé mais je ne parviens pas à trouver comment modifier l’apparence de mes onglets...aucune de mes modifications CSS n’est prise en compte, que ce soit pour les onglets comme pour leur contenu !!(taille de la vignette, couleur....)
Merci de votre réponse !!
Répondre à ce message