Thickbox

Publié le : 20 avril 2007 – Dernière modification le 21 décembre 2021 – par BoOz – 190 commentaires

1
2
3
4
5
66 votes
Le plugin Thickbox pour SPIP, qui permet d’afficher une image avec un effet de présentation à la mode.

Voici le plugin Thickbox pour SPIP.

Présentation

Il s’agit d’une adaptation du code original de Cody Lindley qui permet d’afficher une image avec un effet de présentation à la mode qui se met en route lorsque l’image est cliquée. Sur le même principe, on peut également afficher des fenêtre dites « modales », c’est à dire des pop-up HTML.

Le script se déclenche sur les images par exemple appelées dans un texte par <doc53|center>.

Sur le portfolio de SPIP, ca fonctionne directement comme une galerie d’images (précédant, suivant diaporama etc).

Installation

Installer le plugin

L’installation du plugin s’effectue comme pour tous les autres plugins. Il suffit de récuperer le zip, de le décompresser dans son répertoire « plugins », puis d’aller l’activer dans la page de gestion des plugins.

-  Installer un plugin

Toutes les informations

Télécharger le script

Discussion

5 ans 1 an 3 mois Sans limite
par date
Filtrer

97 discussions

  • psemur

    Bonjour,

    Je souhaite utiliser le plugin Thickbox à partir de #LOGO_DOCUMENT. Tout va bien jusqu’ici mais ensuite à l’affichage au lieu du titre du document+descriptif j’ai l’affichage du nom du fichier + Titre du document..

    Si je remplace « #LOGO_DOCUMENT|#URL_DOCUMENT » par « #FICHIER » tout fonctionne. Et j’ai bien sous l’image TITRE + DESCRIPTIF

    Si joint ma boucle merci de votre aide.

    <BOUCLE_documents_portfolio(DOCUMENTS) {id_article} {mode=document} {extension IN png,jpg,gif} {par num titre, date} {doublons}>

[<a href="#URL_DOCUMENT" type="#MIME_TYPE" onclick="location.href='[(#URL_ARTICLE|parametre_url{id_document,#ID_DOCUMENT})]#documents_portfolio';return false;"
[title="(#TITRE|couper{90}|texte_backend)
[<br ></a><br />(#DESCRIPTIF|texte_backend)]"]>
(#LOGO_DOCUMENT|#URL_DOCUMENT|copie_locale|image_reduire{0,60}|inserer_attribut{alt,[(#TYPE_DOCUMENT|couper{80}|texte_backend)]})
</a>]

</BOUCLE_documents_portfolio>

    Répondre à ce message

  • Bonjour,

    J’utilise le plugin thickbox pour afficher une petite page html de description.

    Je souhaite, au sein de cette page, intégrer un lien envoyant sur une autre page du site.

    Or, si je mets en place un simple lien, la page demandée s’affiche dans la thickbox.
    Alors que je souhaiterais qu’elle s’affiche de façon « classique » dans le navigateur.

    1. Est-ce possible ?

    2. Comment ?

     :)

    Merci

    Répondre à ce message

  • Merlin DEX

    Salut...
    Sur la démo du plugin, la thickbox se redimensionne automatiquement, ainsi que l’image contenue, en fonction de la résolution de l’écran, voire de la taille du navigateur...

    J’utilise la version 192g de spip avec le plugin Thickbox 2, le squelette est home made, et mon problème est que le redimensionnement de la thickbox ne se fait pas : voir le problème sur mon site...

    Quelqu’un peut m’éclairer s’il vous plait ?

    Répondre à ce message

  • 2
    Florent

    Pour ceux qui comme moi ont des soucis à afficher des images avec Thickbox2 sur leur site, des caractères s’affichent en dessous du site.
    En examinant les appels avec la console de Firebug, j’ai remarqué que l’appel qui devait afficher l’image contenait un paramètre url « action=dw2_out », ce qui m’a amené à regarder la configuration du plugin dw2 de plus près et il y a un paramètre à modifier pour que Thickbox2 fonctionne à nouveau comme prévu.
    Le paramètre dans la configuration de dw2 à modifier (qui par défaut est à oui) est :

    Cette option permet d’intercepter les balises #URL_DOCUMENT de vos squelettes et forcer celles-ci à produire un lien du type « spip.php ?action=dw2_out&id=xxx ». La balise #URL_DOC_OUT, propre à DW2, reste toujours fonctionnelle.


    -  Cette option doit être à : non

    Ceci implique que vos squelettes doivent être préparés (avec la balise du plugin dw2) pour être utilisable !

    La confirmation (déjà en 2007 ;-) ici.

    Flo.

    • GLX

      spip 2.0.6 site en cours de personalissation.

      Thickbox a fonctionné un temps mais je ne sais après quel ajout ou modification d’un plugin il a cessé de fonctionner (des caractères s’affichent en dessous du site).

      J’ai noté pratiquement toutes mes modifs mais je n’ai pas à chaque fois verifié mon article avec le portfolio.

      Comme je ne peux modifier dw2, je l’ai remplacé par nyroceros qui va très bien.

      Je vais voir si la cause du dysfonctionnement ne serait pas une option « malheureuse » du couteau suisse.

    • Alex

      De mon côté avec 2.0.6 ça fonctionne SAUF le diaporama qui me renvoie systématiquement sur la page d’accueil après avoir fait défilé deux photos.

    Répondre à ce message

  • 2

    Bonjour,
    J’utilise ce plugin depuis plusieurs mois (exemple sur t@llende Info :) mais je me suis rendu compte que les boutons « zoom », « diaporama », « next » et « suivant » sont d’une couleur très peu visible (quasi invisible !).

    Je cherche depuis plusieurs jours (mais j’y connais pas grand chose...) comment changer la couleur... Sans succès !

    Est ce que quelqu’un peut m’éclairer ???

    Merci d’avance.

    Laurent

    • eric

      Ma façon de proceder face à ce genre de situation ...
      Soit cela vient de mon squelette (surcharge css)
      soit cela vient du plugin ...
      je neutralise le squelette je regarde ce que cela donne avec le « dist », la 9/10 c’est ok, donc cela vient du squelette, en particulier de la css de ton squelette , regarde donc dans la css de thickbox et de ton squelette il doit y avoir une div ou une class qui portent le meme nom ...

      bonne chasse

    • C’est un peut tard, mais ça peut servir à tout le monde. J’ai trouvé sur cette page : http://cvs.drupal.org/viewvc.py/drupal/contributions/modules/thickbox/thickbox.css?annotate=1.4.2.4

      ces quelques lignes à ajouter au fichier thickbox.css

      #TB_window a:link color : #666666 ;

      #TB_window a:visited color : #666666 ;

      #TB_window a:hover color : #000 ;

      #TB_window a:active color : #666666 ;

      #TB_window a:focuscolor : #666666 ;

    Répondre à ce message

  • Gefonline

    Bonjour ! Pour ma part, le plugin V2 fonctionne avec spip 2 sauf que dans la fenêtre qui s’ouvre n’apparaissent ni le titre ni le descriptif du document, et j’ignore dans quel fichier ces paramètres peuvent être appelés. Si quelqu’un peut m’aider...

    Répondre à ce message

  • francecool@hotmail.com

    Bonjour,

    J’utilise actuellement SPIP V1.9.2F + squelette BEESPIP V1.9.2 sur mon site Web, auquel j’ai bien sur apporter de nombreuses modifications (voir le lien ci-apres)

    Concernant THICKBOX, j’utilisais au depart moi aussi la V2, mais vu l’existence de la V3.1, je me suis dit, autant passer a celle la !

    Apres de nombreux tests et lectures de forum, je suis « arrivé » a pondre une version compatible avec SPIP V1.92G + Squelette BeeSpip v.1.9.2 [353]. j’ai corrigé pas mal de petit bugs, d’affichage qui manquait, la compatibilité avec Firefox/opera, etc etc ! donc, pas mal de boulot !

    La version de ce plugin fonctionne parfaitement depuis plusieurs mois sur mon site web !

    Il reste encore une fonction que j’essaye de mettre en place, le code est donc 100% « fonctionnel » avec une partie de code « non activé » encore => fonction ZOOM qui etait dans la V2 mais ne fonctionne plus en passant au code de la V3.1 de son createur....!

    Exemple de thickbox V3 ici

    Je suis donc interesse a participer a son evolution,et si mon plugin en l etat actuel peut faire avancer le « Schimilik », ce sera avec plaisir !

    PS : Mon plugin, comme l ’outil THICKVOX V3.1 original, necessite que le pack JQUERY soit mis a jour ! j’ai donc aussi cree/mise a jour le plugin correspondant = jquery_192 !

    Il necessite OBLIGATOIREMENT la modification du fichier SPIP suivant /dist/modeles/doc.html pour y inserer la classe thickbox
    sur les liens de type « image ».

    Voila lien vers le ZIP de mon plugin THICKBOX V3

    Voila lien vers le ZIP de mon plugin JQUERY_192

    Voila lien vers le modele DOC.HTML

    Merci de m’adresser vos remarques eventuelles ! je prevois de le poster sur SPIPZONE car il n’y a pas a ce jour de plugin « full compatible » avec l’outil Thickbox V3.1 !

    Merci d’avance !
    Pascal

    Répondre à ce message

  • lizarb

    Je voudrais savoir comment faire pour régler le temps d’intervalle entre chaque image en mode diaporama ?

    Où doit-je éditer pour modifier la taille maxi de l’image quand je zoom dessus ?
    Mon site est sous spip2 squelette alternatif avec la dernière version Thickbox2.
    Merci

    Répondre à ce message

  • 2
    rubenxela

    Pour le problème des vidéos et autres format flash :
    Pour ne plus que la galerie passe sous les flash, dans le code source de votre article vous repérez la balise embed qui est celle qui correspond à votre vidéo, et dedans, à la fin vous ajoutez wmode="transparent et le tour est joué.

    De mon côté j’utilise thickbox pour les portfolio et je trouve dommage qu’on ne puisse par récupérer les titres et définition des images. Est-ce que quelqu’un a une solution à ça ?
    Merci

    • MARC

      Voilà je souhaite faire apparaitre un Formulaire SPIP #FORMULAIRE_INSCRIPTION par exemple dans une fenêtre qui aurait été ouverte par un lien class=thickbox avec la syntaxe :

      <div id="monContenu" style="display:none">
#FORMULAIRE_INSCRIPTION
</div>

<a href="#TB_inline?height=500&width=500&inlineId=monContenu" title="Formulaire d'inscription" class="thickbox">Se connecter</a>

      Ce code là ne fonctionne pas le formulaire ne se charge pas !

      C’est sûrement évident, mais çà m’échappe !

      Merci d’avance !!

    • Nat33

      Bonjour,

      il suffit de modifier le modèle doc.html de façon à afficher le titre au lieu de la taille et du format.

      Nat33

    Répondre à ce message

  • gerard

    Pour virer le bord gris sur l’image ajouter ces lignes au fichier thickbox.css

    a:active outline : none ;
    a:focus outline:none ;

    Répondre à ce message

Ajouter un commentaire

Avant de faire part d’un problème sur un plugin X, merci de lire ce qui suit :

  • Désactiver tous les plugins que vous ne voulez pas tester afin de vous assurer que le bug vient bien du plugin X. Cela vous évitera d’écrire sur le forum d’une contribution qui n’est finalement pas en cause.
  • Cherchez et notez les numéros de version de tout ce qui est en place au moment du test :
    • version de SPIP, en bas de la partie privée
    • version du plugin testé et des éventuels plugins nécessités
    • version de PHP (exec=info en partie privée)
    • version de MySQL / SQLite
  • Si votre problème concerne la partie publique de votre site, donnez une URL où le bug est visible, pour que les gens puissent voir par eux-mêmes.
  • En cas de page blanche, merci d’activer l’affichage des erreurs, et d’indiquer ensuite l’erreur qui apparaît.

Merci d’avance pour les personnes qui vous aideront !

Par ailleurs, n’oubliez pas que les contributeurs et contributrices ont une vie en dehors de SPIP.

Qui êtes-vous ?
[Se connecter]

Pour afficher votre trombine avec votre message, enregistrez-la d’abord sur gravatar.com (gratuit et indolore) et n’oubliez pas d’indiquer votre adresse e-mail ici.

Ajoutez votre commentaire ici

Ce champ accepte les raccourcis SPIP {{gras}} {italique} -*liste [texte->url] <quote> <code> et le code HTML <q> <del> <ins>. Pour créer des paragraphes, laissez simplement des lignes vides.

Ajouter un document

Suivre les commentaires : RSS 2.0 | Atom