Lite Box, un visionneur d'images léger pour Dotclear
Par Sacha le 2 décembre 2007, 21:02 - Lien permanent
Note : ce blog utilise désormais Lightbox, plugin officiel pour Dotclear 2. Il vous est également recommandé d'utiliser le plugin officiel plutôt que celui-ci.
J'ai bien aimé les plugins Dotclear finissant en "box" (comme dcLightbox). Seul bémol pour monsieur le vieux ordinateur de Sacha cadencé à 800 MHz : les images s'affichent trop lentement, et les effets de transition allongent encore ces délais d'attente.
Alors j'ai pris la version 1 du script Lightbox qui est beaucoup plus légère et je l'ai intégrée à Dotclear.
Il suffit en effet de préfixer l'URL du lien vers l'image du mot litebox:.
Télécharger LiteBox. En ce qui concerne l'installation et les mises à jour éventuelles, c'est tout automatique.
Bonus
Si vous utilisez un thème qui affiche la langue de la page de destination dans les liens (comme ceci : Dotclear en agnlais), ajoutez ce petit bout de code dans votre fichier CSS pour supprimer la mention de la langue quand le lien pointe vers une image :
a[rel="lightbox"]:after {
content:"";
color:inherit;
background:none;
}
Commentaires
C'est un peu drôle j'osais pas demander encore...J'avais dans l'idée ce type de modification et là tu arrives avec le résultat qui me semble fameux, très rapide en tout cas.
Très très chouette ce ploug, merci chef.
Très bien très bien, mais qu'est ce que ça donne sur une série d'images ?
Un exemple aurait été le bienvenu
Merci.
Osku, comme indiqué, Lite Box utilise Lightbox 1, ne permet pas d'afficher un diaporama d'images. Pour mes besoins personnels cela suffit. Sinon, tu peux utiliser dcjQueryLitghtBox.
Il faudrait modifier un peu le code de Lightbox 2 pour avoir le même fonctionnement sans les transitions. Je verrai cela dès que j'ai un petit moment.
Merci pour le lien vers Lightbox 1.
Aucune urgence pour le diaporama
Le plugin fait échouer la validation W3C. Il injecte dans ma page dans le <head> et le <body> l'appel au javascript et à la feuille de style :
Et j'ajoute que l'appel à litebox persiste quand je supprime le plugin.
Je regarde voir d'où ça peut venir.
Bonjour Osku,
Bien vu, merci de l'avoir signalé. En attendant une correction bien comme il faut, tu peux appliquer un petit patch rapide en remplaçant dans _public.php le code de la classe par celui-ci :
Et vide ton cache une fois le patch appliqué. Désolé pour le dérangement :/
Bon, c'est corrigé dans la nouvelle version (0.2.1), le bug venait d'un octet manquant. En revanche je vais ajouter une procédure de désinstallation pour la suite.
Tout est revenu dans l'ordre
Merci pour l'octet rajouté.
Hello !
J'ai un petit soucis à l'installation du plugin.
Malgré le vidage du cache (même la suppression complete, puis recréation du dossier)
L'information persiste:
"''Les plugins suivants n'ont pas été installés :
Merci d'avance !
Bonjour Bucheron,
Merci d'avoir signalé ce problème, il s'agit effectivement d'une erreur qui vient d'être corrigée dans la nouvelle version 0.2.2 (téléchargements).
Je t'en prie, cela remarche.
Mais, toutefois, j'ai entreprit d'utiliser ton plug in sur les bons conseils d'osku, pour palier à un conflit entre DClightBox et les thême jQuery.
Mais j'ai besoin du diaporama...
En outre, comment fonctionne l'integration sur un lien html (et non wiki) ?
Merci !
Bien, j'aurais du expliquer davantage.
Litebox, c'est pour ceux qui privilégient la rapidité et l'efficacité à la beauté des transitions diverses. Le script est donc minimaliste, il ne fait pas de diaporama, pas d'effets lors de l'ouverture, rien. Si malgré tout tu as besoin de diaporama, il faut voir ailleurs, parce que pour le moment en tout cas, Litebox ne fait pas de diaporama.
Pour utiliser Litebox en mode HTML, il faut entrer ce code :
<a href="image.png" rel="lightbox">Titre du lien</a>.Pour ce qui est de ton soucis, il peut sans doute être résolu, en utilisant une adaptation de dcjQueryLightBox (qui utilise déjà jQuery, donc pas d'incompatibilité possible, à priori). Tente de poser la question à l'auteur de dcjQueryLightBox pour savoir comment enlever jQuery du plugin, puisque jQuery est déjà présent dans ton thème.
Merci beaucoup sacha ! c'est exactement ce qu'il me fallait !
Bonne continuation !
Intéressante fonction, mais j'ai le message suivant dans le tableau de bord : "litebox (To finish installation, please delete the whole cache/cbtpl directory.)"
Je ne sais où se situe le truc à détruire...
Bonjour pas perdus,
Ce message indique que Dotclear n'a pas pu supprimer le dossier
cache/cbtpl. Tu peux le faire manuellement en utilisant le serveur FTP par exemple. C'est un dossier nommécbtplqui se trouve à l'intérieur du dossiercachede ton installation Dotclear.Merci, j'ai supprimé le fichier cbtpl par ftp.
Je reviens dans ma page d'administration, j'ai toujours le même message.
Alors je retourne sous ftp et je découvre un nouveau fichier cbtpl...
Dois-je carrément supprimer entièrement le fichier cache via ftp ?
Pas perdus : ton soucis ressemble à celui de Bucheron dans le commentaire #11 : quelle version de Lite Box utilises-tu ? (ici, la version la plus récente)
j'utilise cele-là : plugin-litebox-0.2.1.pkg.gz sur dotclear 2 beta 7.
je vais essayer la version sur le lien de ta réponse
Merci, il n'y a plus le message d'erreur.
J'ai une question bête quant à la place du fichier.jpg
Dans mon fichier "public/img" dois-je ajouter les fichiers "plugins/litebox" pour placer mon fichier.jpg afin que litebox fonctionne?
Bonsoir pas perdus,
Une fois le plugin Litebox installé, il n'y a plus rien à configurer, il ne reste plus qu'à rédiger les billets. Sers-toi de l'exemple wiki fourni :
Si tu utilises le mode XHTML, il faut ajouter l'attribut
rel="lightbox"à ton lien pour que l'image s'ouvre dans la fenêtre Lightbox. Par exemple :Note : Lightbox ne fonctionne que dans la partie publique, c'est à dire après la publication du billet.
ça ne fonctionne pas, ne serait-ce pas parce que je suis sous query ?
Non, jQuery ne devrait rien changer à l'affaire, j'utilise jQuery aussi... Pourrais-tu me faire voir le billet en question ?
Mon billet se nomme "photobus" et le fichier "photobus.JPG" :
Le chemin est le suivant : "pas.perdus/public/blog2008/fichier.JPG"
J'ai fait plusieurs essais :
ça n'a rien donnée, peut-être as-tu la solution?
Étrange, je vais y jeter un coup d'œil, en attendant, pourrais-tu mettre en ligne ce billet en m'indiquant l'URL ? C'est peut-être lié au JavaScript.
http://stefbac.free.fr/pas.perdus/i...
merci
Ton code HTML est invalide... Et si tu essayes comme ceci :
J'ai fait une copie locale de ta page web, et en ayant modifié le lien comme suit ça marche :
j'ai recopié en xhtml ta 2ème ligne. Un progrès, la photo s'affiche en grand format quand je clique.
Par contre, pas d'image miniature quand j'arrive sur la page...
http://stefbac.free.fr/pas.perdus/i...
Quelques légers progrès effectivement !
Et la première ligne en wiki ne fonctionne pas ? (elle devrait, au fait, elle devrait)
Quand aux miniatures, c'est à toi de les mettre à la place du texte. Si tu ne sais pas comment, je t'invite à consulter la documentation (en particulier la syntaxe wiki) ou poser la question sur le forum. Rassure-toi, Dotclear fait automatiquement les miniatures quand tu envoies des images par le gestionnaire des fichiers.
En espérant qu'avec un peu d'effort tu y arriveras.
merci
Coucou, il existe un autre script léger :
Splash Image
Splash Image paraît intéressant, merci Osku de l'avoir noté. Je comptais modifier Lightbox 2 pour le simplifier, mais je vais plutôt décortiquer Splash Image.
J'aimerais juste dire que je n'ai plus le temps de me consacrer au développement de nouveaux plugins au moins jusqu'aux vacances (mais je maintiens ceux qui sont disponibles en téléchargement).
Je viens de trouver encore un script, qui semble être performant sur ma machine malgré les effets de transitions :
http://www.phatfusion.net/multibox/
Encore plus intéressant, ça ne se limite pas aux seules images.
Personnellement j'utilise lytebox que je trouvais mieux que lightbox. Par contre depuis que j'ai vu phatfusion je me demande si je ne vais pas changer un peu
Merci de me l'avoir fait connaitre!
Voilà je viens de changer, un peu difficile de s'adapter au début mais au final que du bonheur!
rencontre, si c'est pour faire la promotion de tous tes sites de rencontres, j'efface, ce n'est pas un lieu de publicité gratuite ici.