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

  • 14
    Raphael Goetter

    Hello,

    Je viens d’installer ce plugin, mais le résultat est bizarre : l’effet thickbox fonctionne quand je clique dans un fichier du portfolio dans l’espace d’administration... mais ne fonctionne pas sur la page en ligne !

    Une explication à cela ?

    • j’ai le meme soucis, personne ne m’a aidé sniif

    • b_b

      Bonjour,

      Est-ce que la balise #INSERT_HEAD est bien présente dans vos squelettes ?

      Pouvez-vous nous filer une url vers les pages en question ?

      ++

    • Marc

      bonjour,
      Je fais le même constat : le plugin ne fonctionne pas sur mes pages sommaire et article (mais fonctionne sur les vignettes dans la partie administration)
      J’ai bien rajouté la balise #INSERT_HEAD dans le head des squelettes.
      J’utilise un spip la version : SPIP 1.9.2c [10268] et un squelette de Pascal Hoquet d’Atipik Biz que j’ai un peu adapté.
      J’arrive au bout de toutes mes recherches et je suis bloqué, si vous pouviez me mettre sur la voie !...
      le lien de mon blog

      Merci d’avance et bonne journée

      Cordialement - Marc

    • je me réponds à moi même... si ça peut être utile.
      J’ai trouvé une solution : en fait il faut charger les images comme « document » et non pas comme « image ».
      Pour améliorer la chose, j’insère au format « miniature », au préalable j’ai modifié la taille de la miniature dans le menu configuration/fonctions avancées/Génération de miniatures des images, dans mon cas toutes mes images font 455 pixels de largeur pour s’adapter au squelette.

      Le diaporama généré par thickbox permet ainsi d’afficher les images à une taille supérieure à celles du squelette.

      Voilà il ne reste plus qu’à convertir la plupart des images en doc dans les articles qui afficheront ainsi un diaporama.

      bien amicalement - marc

    • Jean-Luc GARNIER

      Bonjour, j’ai également un problème avec ce plugin : les images ont été insérées comme image dans l’article (bouton « Ajouter une image »), mais je les affiche comme doc (<docXXX|center>). L’effet Thickbox ne s’applique pas, et je pense qu’il faudrait « convertir » les images en doc, mais comment faire ?

      Merci d’avance !
      voir : http://www.smarttees.asso.fr/spip.php?article125

    • oce

      hey j’ai un big problème je suis sous SPIP 1.9.1, j’ai dl JQueryplugin et thickbox2 mais ça ne me donne pas l’effet voulu après le clique sur l’une de mes photos, comme avec la version 1.9.2 quelqu’un pourrait il me dire pourquoi ?

    • b_b

      Bonjour,

      Vérifie que tes liens vers les images dans le portfolio portent bien la class="thickbox".

      ++

    • oce

      oui j’ai ça !

       <div id="documents_portfolio" class="thickbox">
																			
<BOUCLE_documents_portfolio(DOCUMENTS) {id_article} {mode=document} {extension IN png,jpg,gif} {par num titre, date} >
[<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{80}|texte_backend)"] >
(#FICHIER|copie_locale|image_reduire{0,60}|inserer_attribut{alt,[(#TITRE|couper{80}|texte_backend)]})</a>]
</BOUCLE_documents_portfolio>
				</div>

      en faite quand je clique sur une photo ça me l’ouvre dans une autre page et non avec l’effet produit avec la thickbox2

      depuis hier que je suis sur ce problème j’ai beau chercher mais je ne trouve pas à quoi ceci est du ...

    • b_b

      Non tu n’as pas les class="tchibox" sur les liens vers les images. Pour ce faire il faut que tu modifie ton code comme ceci :

      [<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{80}|texte_backend)"] class="thickbox">

      Tu peux aussi en profiter pour faire une mise à jour de ton spip vers la 192d comme ça tu n’auras plus besoin du plugin jQuery et le portfolio fonctionnera directement avec thickbox.

      ++

    • oce

      oui c’est ce que l’on vient de faire, c’est mieu car cétait vraiment trop la galère

      mais merci pour tes réponses

    • oce

      ah j’ai une autre question
      est ce que tu saurais comment il faut faire pour afficher les photos agrandies (après clique) vers le bas de la page
      car j’ai un flash en haut et sous firefox, mon image agrandie va en dessous du flash

      merci encore

    • b_b

      Normalement ce problème est résolu, à voir sur la page de démo du plugin (en bas) :

      http://spip-zone.info/spip.php?article31

      Essaye de faire une mise à jour de ton plugin.

      ++

    • oce

      en faite mon collègue a fait une modif au niveau du flash
      avec un value=« transparent » et un wmode=« transparent »

    • comteg

      Bonjour

      Je suis actuellement sur un projet de squelette de site internet.

      J’ai installé :
      -  La version SPIP 1.9.2d [11132]
      -  La dernière version du plugin sur la page de présentation.
      -  #insert_head est bien installé (la preuve c’est que j’ai l’appel dans ma page article du plugin)
      -  Les images sont mise dans mes articles via « ajouter un document » —>< doc53|center >

      Le tout fonctionne bien dans la partie administration.

      Par contre côté public, gloup cela ouvre l’image en plus grand mais j’ai l’impression que le script ne se lance pas (que ce soit dans une page rubrique ou article)

      Pour tester : Par ici

      Peut être avez-vous la solution...

    Répondre à ce message

  • 1
    oliv316

    bonjour
    et merci pour ce super plugin

    j’utiliser le squelette alternative sur mon site et j’ai installé le plugin thicbox

    j’ai bien validé les page en XHTMLl1 mais en revanche le CSS de thickbox ne passe pas test de validation W3C

    j’obtiens ceci

    42 #TB_overlay Erreur lors de l’analyse grammaticale. opacity=60)

    43 #TB_overlay La propriété -moz-opacity n’existe pas : 0.6

    44 #TB_overlay La propriété opacity n’existe pas en CSS niveau 2.1. mais existe en [css3] : 0.6

    140 #TB_HideSelect Erreur lors de l’analyse grammaticale. opacity=0)

    141 #TB_HideSelect La propriété -moz-opacity n’existe pas : 0

    142 #TB_HideSelect La propriété opacity n’existe pas en CSS niveau 2.1. mais
    existe en [css3] : 0
    150 #TB_iframeContent La propriété _margin-bottom n’existe pas : 1px

    j’ai recherché sur le mais les css modifé soit disant compatibles ne passent pas
    et si l’on supprime l’opacity c’est pas terrible

    si quelqu’un à une idée
    merci d’avance

    • oce

      hey
      j’ai un big problème
      je suis sous SPIP 1.9.1, j’ai dl JQueryplugin et thickbox2 mais ça ne me donne pas l’effet voulu après le clique sur l’une de mes photos, comme avec la version 1.9.2
      quelqu’un pourrait il me dire pourquoi ?

    Répondre à ce message

  • fractale

    Bonjour,

    Tout d’abord merci pour ce plugin formidable...

    je voudrais juste ajouter le descriptif des documents lorsque l’image apparait en surimpression.
    Quel fichier faut il retoucher ? thickbox.js ? le fichier html dans l’article ?

    Merci beaucoup.
    Fractale

    Répondre à ce message

  • sjpa

    alut,

    j’utilise Thickbox sans problème et c’est vraiment chouette : j’ai un peu modifié les css par goût.

    Mon (minuscule) problème est le suivant. J’importe mes images comme doc. J’en place 2 ou 3 dans l’article. Les autres en portfolio. Je donne un titre à chaque image. Ce titre n’apparait dans Thickbox que pour les images du portfolio. Pour celles placées dans l’article c’est le type et lepoids de l’image qui apparâit. Je voudrais bien sûr que toutes les images aient leur titre.

    Si vous aviez une idée... Merci d’y réfléchir. Exemple http://www.malem-auder.org/spip.php?article10

    André

    Répondre à ce message

  • eric

    Bonjour

    Le plug fonctionne impex sur un article.

    Je suis confronté à la demande suivante :

    X articles dans une rubrique avec à chaque fois 1 seule photo par article.

    Je voudrais pouvoir utiliser Ce plugin de la façon suivante
    recupérer toutes les images des articles et en faire un diaporama.

    Est ce envisageable ?

    Si vous avez une piste je suis preneur.

    Spipement à vous

    Répondre à ce message

  • M’Klod

    Bonjour,

    Je viens de me rendre compte que quand le plugin « fenetres flottantes » est activé, on ne peut plus fermer la fenêtre popup du diaporama ouvert par Thickbox. Il faut donc pour le moment utiliser soit l’un soit l’autre.

    Je signale ce problème également sur l’article « fenetres flottantes »

    Répondre à ce message

  • Stef

    Bonjour,

    Et félicitations pour ce plugin si utile.
    Y a t il un moyen d’afficher la description d’une image ?

    Merci,

    Stef

    Répondre à ce message

  • laurent Hardouin

    Comment peut on agir sur la taille de l’image de sortie dans le diaporama ?

    Répondre à ce message

  • Mopi

    Bonjour,

    J’aimerai utiliser Thickbox pour le formulaire de contact. J’ai réussi à l’afficher dans thickbox mais quand on soumet Thickbox ne reste pas affiché.
    Ce plugin est génial pour éviter d’utiliser les pop-up.

    Quelqu’un peut m’aider s’il vous plaît ?

    Merci

    Répondre à ce message

  • 1
    artemisangel

    bonjour à tous et à toutes !

    J’utilise le plugin thickbox sur mon site. Il fonctionnait très bien jusqu’à ce que je me rende compte qu’un charabia remplaçait les images :(

    Je suis en spip 1.9.2c, j’utilise le squelette multisaisons et une liste (assez longue) de plugins : Acces Restreint 2.0 / Article PDF / Autorité /Balise Session / cfg : moteur de configuration / Le Couteau Suisse / Crayons / Envoyer par mail / Formulaires&Tables (SPIP 1.9.1+) /Imprimer document / Nuage / Recherche Etendue / SPIP-Listes / Splickrbox
    /Squelette par mot clef / Thickbox v2.

    Bien sur, j’ai désinstallé thickbox, vidé le cache, rechargé les photos et réinstallé thickbox mais ça n’a pas marché, malheureusement.
    Est-ce que quelqu’un aurait une idée s’il vous plait ?

    Merci d’avance :D

    Pour voir le message « charabia », il faut utiliser firefox : mon site

    • artemisangel

      je me réponds à moi-même : il s’agissait d’un réglage « incomplet » du plugin « accès restreint » (configuration des acces.htaccess, Accès aux document joints par leur URL : autoriser la lecture, le tout dans l’espace privé).

      voilà un problème de moins à régler :)

    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