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

  • robomatix

    J’ai essayé d’utilisé ce plugin avec SPIP 2.0.10 et j’ai obtenu une thickbox vide et en haut de la page... Est ce que d’autres on eu le même problème ?

    Enattendant, je me suis rabattu sur la FancyBox !
    http://www.spip-contrib.net/FancyBox

    Répondre à ce message

  • tarentaise

    Une question me vient à l’esprit cela ne fonctionne qu’avec des fichiers images ou l’on peut l’adapter pour des fichiers vidéos ?

    D’avance merci pour la ou les réponses

    Répondre à ce message

  • 3
    pascal

    Le plugin fonctionne a l’exception de la numérotation qui me double le nombre de photos et qui affiche de 2 en 2.

    Bizarre, quelqu’un aurait une idée.

    Exemple : http://www.patricemorin.com/spip.php?article646

    Merci !!!

    Pascal

    • Tchang

      Bonjour Pascal,

      Concernant ton problème de numérotation (ou plutôt décompte) des images, je te conseille de regarder à la longueur (nombre de caractères) du titre de tes images.
      Au besoin, un titre plus condensé ou une modification du fichier inc-documents.html pourra peut être résoudre ton problème.

    • DominiqueRT

      Salut,

      J’ai eu le même problème que toi.
      En effet, je me suis inspirer moi aussi sur mon site de ce qui avais été fait sur le site http://www.patricemorin.com et j’ai eu le même problème.
      Il apparait que toute les photos sont doublés car il y a 2 liens par photos (une pour« Cliquez pour agrandir... », l’autre pour la photo). Dans le code « thickbox.js » il suffit de regarder si l’image n’est pas déjà présente avant de l’insérer.

      Pour cela, remplace :

      // we store image links in an array (for a gallery)
				imageArray.push ([
					this.href,
					this.title || this.name
				]);

      par :

      var TB_FoundURL = false;
for (TB_Counter = 0; (TB_Counter < imageArray.length) ; TB_Counter++) 
{
	if (this.href.toLowerCase()==imageArray[TB_Counter][0].toLowerCase())
	{
		TB_FoundURL=true;
		break;
	}
}
		

if (TB_FoundURL==false) 
	{   
	// we store image links in an array (for a gallery)
		imageArray.push ([
			this.href,
			this.title || this.name
		]);

	}

    • Salut, J’ai un problème similaire au tiens !

      à savoir que à l’affichage du diaporama fonctionne dans le sens inverse ! de la dernière image à la première !
      celui-ci affiche l’image 8/8 en premier puis 7/8 ect...

      de plus le bouton diaporama ne fonctionne qu’ après avoir fait tout le diaporama à l’envers c’est à dire une fois arrivé sur l’image 1/1

      Si quelqu’un à une idée se serai super ! merci

      pour voir ici
      http://www.bsecreation-graphique.com/spip/spip.php?rubrique28&var_mode=recalcul#

    Répondre à ce message

  • 2
    chankalan

    salut,

    j’ai modifié un peu pour avoir la description de l’image sous le titre, ça m’arrangeait : c’est pas une bien grande différence en soit... l’idéal serait peut-être de rendre cette fonctionnalité optionnelle ?

    • ayento

      Géniale... t’as fait comment ?

    • ayento

      Pour ceux qui serait interressé à avoir autre chose que le type d’image et son poids dans la fenêtre thickbox. Il suffit de modifier le fichier doc.html du dossier modeles de son squelette ou, si il est absent, aller le chercher dans /prive/modeles. Dans ce fichier remplacer :

      title='#TYPE_DOCUMENT - [(#TAILLE|taille_en_octets|texte_backend)]'

      par :

      title='[(#TITRE)] [(#DESCRIPTIF)#NOTES]'

      et voila...

    Répondre à ce message

  • DominiqueRT

    Bonjour,

    Je viens d’installer ce plugin qui fonctionne à merveille. Quelle modification faut il apporter pour afficher « Cliquez pour agrandir... » au dessus de chaque photo ?

    Cela semble possible : http://www.patricemorin.com/spip.php?article658

    Merci

    Répondre à ce message

  • 1
    lizarb

    Où regler le temps du diaporama ?

    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

    • dcap

      Pour modifier le tempo du diaporama aller dans le dossier du plugin, puis dans le sous-dossier javascript. Editer le fichier thickbox.js (vers le début). C’est normalement fixé à 7000 (soit 7s, ce qui est beaucoup).
      J’ai mis 4000, ce qui fait 4s, (ce qui est mieux à mon avis).

      //on page load call TB_init

      //

      // init

      //

      var DELAI = 4000 ; //nombre de secondes entre deux images

      var imageArray = [] ;

      var FULL_S = false ;

      var DIAPO = false ;

    Répondre à ce message

  • loximose

    Bonjour,
    alors de mon côté je seche pour une chose ...
    j’utilise thickbox pour ouvrir une page contact , avec un lien comme cela :

    href=spip.php ?page=contact&TB_iframe=true&width=700&height=500

    seulement, mon site étant en 3 langues (allemand, anglais et français principal), comment je fais pour récupérer la variable d’environnement du site ???
    j’essaie avec #ENVlang , ou #LANG, de le passer en variable...mais rien n’y fais, le popup contact thickbox reste en français ...

    merci pour votre aide .....

    Répondre à ce message

  • mr_zo

    Bonjour, Comment effectuer plusieurs groupes d images ?
    a partir d une vignette ne lancer que plusieurs images définies
    _ex : doc4,5,6|left> doc7,8,9|left>
    serait il possible de faire quelques chose comme ça ?

    Merci.

    Répondre à ce message

  • Le Corbeau

    Bonjour,
    Je vous informe que ce plugin n’est pas compatible avec la fonction
    « interdire la lecture des documents en l’absence de publication de l’article » d’acces restreint 3

    Le plugin se bloque au chargement de la première photo et seul le fond de page est affiché, un clic fait réafficher l’article.

    Précisions
    -  Le portofolio d’origine n’a aucun problème avec cette fonction
    -  le site est totalement à jour avec les composants récupérés le 14 /08/2009

    Répondre à ce message

  • Bonjour à tous

    je ne suis pas un pro du dév et j’aimerais avoir ce genre de résultat sur mon site

    voir ici : http://sorgalla.com/projects/jcarousel/examples/special_thickbox.html

    Peut-être est-ce déjà dév en plugin quelque part ?

    Merci d’avance

    Cordialement

    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