SPIP-Contrib

SPIP-Contrib

عربي | Deutsch | English | Español | français | italiano

251 Plugins, 182 contribs sur SPIP-Zone, 149 visiteurs en ce moment

Accueil du site > Rédaction > Sommaires > Onglets dans texte > En onglets dans le texte de SPIP, ou ailleurs...

En onglets dans le texte de SPIP, ou ailleurs...

18 décembre 2006 – par Pi r – 80 commentaires

5 votes

Une mise en page en blocs superposés, très pratique pour des fiches techniques par exemple, toutes versions SPIP !

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).

Zip - 11.3 ko
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 :

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

Cascading Style Sheet - 1.2 ko
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...

Retour en haut de la page

80 Messages de forum

Voir toute la discussion

Pages 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8

  • Répondre à ce message

    29 décembre 2009 19:10

    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

    20 septembre 2009 23:00, par pascalw

    Salut

    merci pour ce plugin bien sympa
    j’ai un (tout petit) souci concernant l’ordre des onglets. Je crois connaître l’origine du problème mais je ne connais pas assez bien javascript pour y remédier :

    j’utilise en fait le plugin pour générer des onglets à la fois dans le squelette et dans le texte (via des modèles).

    Tout fonctionne à merveille. Au niveau du code source de la page, mes titres et mes contenus sont dans le bon ordre, mais ce sont simplement les onglets qui ne sont pas dans le même ordre que le contenu : les onglets créés dans le texte via les modèles sont positionnés avant les onglets générés directement dans le squelette.

    J’imagine que c’est simplement que dans le code du js c’est le champ texte qui passe d’abord à la moulinette, puis le squelette ?

    C’est gênant car lorsqu’on arrive sur la page, c’est un onglet secondaire qui s’affiche et l’onglet principal se retrouve après tous les autres...

    Quelqu’un saurait comment corriger le js pour que le squelette passe avant le champ texte ?

    merci du coup de main

  • Répondre à ce message

    12 septembre 2008 23:50, par Tropicaloo

    [Résolu]

    Pour ceux qui rencontreraient le même problème avec IE6, j’ai trouvé la solution en rajoutant la propriété position : relative ; aux classes du css de spip :
    .spip_documents_right et .spip_documents_left

  • Répondre à ce message

    2 septembre 2008 01:45, par Tropicaloo

    Bonjour,

    Quelqu’un sait-il comment résoudre via les CSS le bug d’IE6 qui n’affiche pas les images (documents) inclus dans un article lorsqu’ils sont alignés à gauche ou alignés à droite (float left et float right) ?

    J’ai beau mettre des z-index à 10, 100, ... etc sur les classes .spip_documents .spip_documents_right et .spip_documents_left
    rien y fait, IE6 ne veut rien entendre et la suppression de la couleur sur .dynamic-tab-pane-control .tab-page dans tab.css (astuce donnée dans un commentaire si dessous) n’est possible que sur un site au fond de couleur identique au tab.page.
    Merci.

  • Répondre à ce message

    10 juillet 2008 20:17, par Klesk

    Ca serait une très bonne idée que de faire des onglets a la verticale avec un choix possible entre les deux et le top du top la possibilité de les alterner en cascade par exemple pour pouvoir créer des hierarchie en onglets. Il serait fort éagréable dans le meme sens de pouvoir attribuer des styles différents a des onglets imbriqués les uns dans les autres.

    Genre 1er niveau blanc, niveau infirieur dans la hierarchie d’une autre couleur etc... J’ai essayé de le faire mais j’ai l’impression que le plugin est trop dépendant des class et id qui sot attribuées aux div, on ne peut donc pas faire des class différentes ou difficilement.

  • Répondre à ce message

    31 décembre 2007 02:07, par alm

    Bonjour pierre,

    Merci pour ton plugin, j’ai ajouté un peu de javascript pour avoir en plus le code généré dans le 3em onglet, difficile à expliquer mais visible ici http://elastick.net/Astuces-SPIP

    si ça peut servir, help yourself

    ++

    *alm remember chatillon virtutus

  • Répondre à ce message

    9 novembre 2007 00:19, par loloboy

    Un grand merci tout d’abord pour ce plug très pratique !

    N’étant pas très expérimenté, je voudrais savoir comment changer la couleur de fond des onglets (bleue par défaut) pour la rendre transparente par exemple ou mieux (soyons fou !) attribuer une couleur par onglet.

    Merci encore

  • Répondre à ce message

    7 novembre 2007 19:26, par nicolas

    Je m’auto-réponds (vraiment désolé de polluer le forum... mais on peut éventuellement supprimer mes messages intermédiaires.)


    Une solution qui fonctionne :

    J’ai ré-étalonné le z-index dans le fichier tab.css

    Si j’ai bien compris ce critère gère la superposition des différents éléments. Il devait y avoir un conflit au niveau de la valeur par défaut du z-index des éléments du squelette dans habillage.css.

    En augmentant tous les z-index d’une unité dans tab.css le problème s’est réglé.

  • Répondre à ce message

    7 novembre 2007 19:02, par nicolas

    Voilà en gros le code source de la partie concernée..

    div id="conteneur">

    div id="contenu">

    ...

    div class="tab-pane" id="">

    div class="tab-page">

    h2 class="tab">titre premier onglet/h2>

    contenu premier onglet

    /div>

    /div>

    ...

    désolé pour le format, j’ai enlevé les < de début de balise, je ne sais plus comment on cite du code.

  • Répondre à ce message

    7 novembre 2007 18:55, par nicolas

    Je viens d’essayer... mais ça ne change pas le bug sous IE.
    Le tableau déterminé par l’onglet semble ne pas être inclus dans le "div contenu".
    Le contenu de l’article est "scrollé" par la barre de défilement déterminée dans le "div contenu" alors que le tableau des ongets est scrollé par la barre de défilement de la page entière....

    J’essaye de regarder dans le code source de la page ce qui peut clocher... mais je ne vois pas...

    est-ce que ce ne serait pas le ".dynamic-tab-pane-control"... dont je ne connais pas rôle ?

    Merci pour l’idée quand même.

Pages 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8

Répondre à cet article

Retour en haut de la page

Ça discute par ici

  • Plugin ABCalendrier

    20 avril 2008 – 74 commentaires

    Un mini calendrier pour publier des évènements depuis les articles et les brèves

  • Diapos

    10 mars – 27 commentaires

    Comme son nom l’indique, c’est un (petit) plugin qui rappelle un peu le fonctionnement d’un projecteur de diapositives. Seules contraintes : il nous faut des images ayant la même largeur et il nous faut numéroter les images. Il suffit pour cela de (...)

  • Champs Extras 2

    9 janvier 2009 – 382 commentaires

    Ce plugin permet de créer et/ou de gérer des champs supplémentaires dans les objets éditoriaux de SPIP. Il permet donc de prendre en compte et d’afficher de nouveaux éléments dans les articles, rubriques, mots, groupes de mots, auteurs et sites. (...)

  • Agenda 2.0

    3 novembre 2008 – 446 commentaires

    Voici la version pour SPIP 2.0 du Plugin Agenda pour SPIP 1.9.2, avec une interface remaniée pour encore plus de plaisir

  • Plugin Captcha2

    3 octobre 2007 – 89 commentaires

    Le Spam peut submerger votre site SPIP. L’une des alternatives est d’utiliser un systême de Captcha qui permet de se protéger assez efficacement des robots .