DISQUS

John-Noone: John Noone » Lightbox+

  • Pierre · 3 years ago
    Domage que ca ne fonctionne pas ...

    la decompression donne le nom lightbox-plus, alors que les fichiers ont comme chemin wp-lightbox2

    Et puis même après modification du path ça marche toujours pas, plutôt que de vanter une install facile vous feriez mieu de l'expliquez.
  • Xavier · 3 years ago
    Exact ! Je corrige cette étourderie.

    Celle qui est présente maintenant devrait mieux fonctionner. À tester :)
  • MilleSabords · 3 years ago
    Le caption des photos apparait en gris clair sur blanc...donc illisible. Que modifier dans le lightbox.css pour avoir le caption en noir?
    Comment changer la taille de la police et les couleurs des boutons diaporama/stop et >. Merci.
  • Xavier · 3 years ago
    Voici le html généré par le script :
    <coolcode lang="html" linenum="false">
    <div id="imageDataContainer">
    </div><div id="imageData">
    </div><div id="imageDetails">
    <span id="caption"></span>
    <span id="numberDisplay"></span>
    </div>
    <div id="bottomNav">

    »


    Diaporama


    «


    Close

    </div>


    </coolcode>

    Donc toutes les améliorations que tu demandes se jouent au niveau de la CSS.

    Actuellement, la CSS est paramétrée pour héritée de la couleur du body. Pour modifier la couleur par défaut, il suffit d'appliquer un style color sur la balise qui t'intéresse. Je pense que la balise #imageData est celle qui t'intéresse.
    Par exemple, #imageData { color: purple; } affichera les textes en mauve.

    Pour la navigation, les balises sont #bottomNavNext #bottomNavDiaporama et #bottomNavPrev. Pareillement, il suffit d'appliquer les bons styles CSS, soit font et background.

    J'espère avoir bien répondu :)
  • Xavier · 3 years ago
    Pensez-vous qu'il faille ajouter une page statique de test ? Ainsi les utilisateurs pourront plus facilement bidouiller leur CSS ?
  • MilleSabords · 3 years ago
    Tu as bien répondu. Merci beaucoup.
  • Das · 3 years ago
    Je laisse la technique à tes autres "commenteurs".

    En ce qui concerne le "c'est mieux sur msn ou ailleurs", en général, ça commence comme ça et après, elle te revient avec un : "euh, tu peux m'aider à changer la couleur de fond et puis ceci, et puis cela" et au final, c'était mieux quand c'était fait maison car on faisait ce qu'on voulait...

    Ma femme veut changer de plateforme tout les deux ou trois mois et au final, c'est pas si mal un spip bidouillé.

    Ah... les femmes de web-trifouilleurs !
  • Xavier · 3 years ago
    C'est ce que je me tue à lui répondre : on est mieux servi que par soit-même. !

    Maintenant, il faut trouver le temps de se servir.
  • Anne · 3 years ago
    Bon. Deja, j'arrive sur la page, et je vois mon nom en gros dessus. Je passe pour une chieuse. Fair enough.
    Et puis apres je vois qu'on rajoute des commentaires en disant que je fais des comparaisons a la con et que je devrais etre raaaavie du site que m'a bidouille crouton.
    Eho les gars, on se calme ! Moi, si je fais ca, c'est juste pour vous donner de nouveaux challenges, vous apprendre a vous adapter a des clients capricieux.
    Mais vous me direz merci plus tard...
    : )
  • Das · 3 years ago
    Tout ce que je dis, c'est que les femmes de web-bidouilleurs voudraient souvent avoir des sites comme tout le monde mais en plus avec les bidouilles de mÔssieur...

    Total, on fini par avoir peur du "Je passerais bien mon site sur typepad, blogger ou msn" et on fait bidouilles sur bidouilles pour que vos sites soient les plus beaux...

    Maintenant, si tu veux te plaindre, adresse toi au cousin du "meet market" :-D Par contre, j'espère que ma femme ne lit pas ce blog, histoire qu'elle ne me resorte pas le "Moi, si je fais ça, c’est juste pour vous donner de nouveaux challenges, vous apprendre a vous adapter a des clients capricieux.
    Mais vous me direz merci plus tard…"
  • LK · 3 years ago
    This is great! I dropped your update into the photo gallery plugin we are using (http://www.wildbits.de/mygallery/). What a great enhancement!
  • sylvainman · 3 years ago
    Super ce plugin.
    Merci beaucoup.
    J'aimerais seulement changer la durée de l'apparition des photos à 3 secondes au lien de 10. Où puis-je changer cette donnée ?
    Merci.
  • Xavier · 3 years ago
    En bas du fichier lightbox.js se trouve cette ligne
    <coolcode lang="javascript" linenum="false">
    var pe = new PeriodicalExecuter(jumpImage, 10);
    </coolcode>

    C'est cette ligne de code qui appelle la fonction jumpimage toutes les 10 secondes. Il te suffit de changer le 10 par le nombre de secondes qui t'intéresse.
  • sylvainman · 3 years ago
    Merci beaucoup.
  • Denis · 3 years ago
    j'ai téléchargé le plugin, je l'ai installé et activé. Et après, je ne comprends pas comment ça marche au niveau des photos. Comment je les insère dans l'article pour que lightbox+ s'en serve?
    merci d'avance de m'éclairer
  • denis · 3 years ago
    peut-on choisir la dimension des vignettes et où se trouve cette option ?
    merci d'avance pour ta réponse

    sinon ça marche quand on lit correctement!! hum hum
  • Xavier · 3 years ago
    Pour insérer des images, tout ce passe dans la page "écrire un article".
    Sous le champ d'article, se trouve le gestionnaire de pièces-jointes.
    Il suffit de cliquer sur la pièce-jointe désirée, choisir les options "Utilise la miniature" et "Lié à l'image", puis cliquer sur "Envoyer à l'Editeur".
    Le plugin se chargera de transformer ces images insérer ainsi en image lightboxisées.

    Sinon, je ne comprends pas ce que tu appelles vignette dans la seconde question :
    - Si c'est les miniatures générées par WordPress, alors non, ce plugin ne permet pas de les redimensionner.
    - Si c'est les images contenues dans le diaporama, les images sont automatiquement redimensionnées pour qu'elles soient affichées entièrement dans la fenêtre du navigateur.
    Donc dans tout les cas, il n'y a pas d'option pour régler la taille des images.
  • denis · 3 years ago
    merci pour ta réponse rapide.
    Si j'ai bien compris, les vignettes sont générées par wordpress, il va falloir que je regarde où la grandeur des miniatures est généré.
    Si tu le sais, merci de ta réponse.
  • Xavier · 3 years ago
    Là je sèche :(
  • Jean-Marc · 3 years ago
    Je viens de tester ton script sur free et c'est nickel ! Par contre en local (avec easy php) quand je clique sur une photo dans naviguer, aucune miniature est barré et quand je clique dessus, j'ai le message : aucune miniature n'est associée à cette image.
    C'est grave docteur ? Merci d'avance pour ton aide.
    Ah oui, j'allais oublier pour avoir une petite bordure noire autour de la miniature dans un post il faut que j'édite les css du plugin ou du thème ?
  • denis · 3 years ago
    j'ai trouvé (après 2 jours de recherche ...). La grandeur des vignettes est gérée dans le fichier inline-uploading.php du répetoire wp-admin.
    merci pour ce superbe plugin !!!
  • Xavier · 3 years ago
    Denis : merci :D

    Jean-Marc : Ce plugin ne permet pas d'ajouter une bordure noire autour des images, mais tu peux le faire avec un style CSS. Grosso-merdo, il te suffit d'éditer le fichier CSS ton thèmes, en ajoutant cette ligne :

    <coolcode lang="css" linenum="false">
    a img {
    border: 1px solid black;
    padding: 2px
    }
    </coolcode>

    Elle se traduit par : à toutes mes images (images) qui sont dans des lien (a), ajoute une bordure (border) d'un pixel d'épaisseur (1px), continue (solid), noire (black), et un espace (padding) de deux pixels.

    Maintenant que tu as mis cet effet goûtu, tu peux ajouter le caviar en montrant que cette image est cliquable. Pour cela, tu peux changer la couleur de la bordure. Pour cela, il te suffit d'ajouter un événement de survol (:hover) dans ta CSS.

    <coolcode lang="css" linenum="false">
    a:hover img {
    border: 2px dotted red;
    padding: 1px
    }
    </coolcode>

    Elle se traduit par : quand je survole (:hover) mes liens (a), changer le style de mes images (img) par une bordure (border) de deux pixels d'épaisseur (2px), en pointillée (dotted), rouge (red), et un espace (padding) d'un pixels.


    Pour ce qui est des images avec Easy PHP. WordPress se base sur la librairie GD2 pour manipuler les images, dont créer les vignettes. Il me semble que cette librairie n'est pas activée par défaut sur Easy PHP. Tu trouveras plus d'infos sur le forum du soft http://www.easyphp.org/forums/read.php?f=7&i;=1...
  • Jean-Marc · 3 years ago
    Merci beaucoup Xavier pour cette réponse très complète. J'adore le design de ton blog : "Classieux !" comme dirait Serge ;-)
  • Xavier · 2 years ago
    C'est complétement la classe américaine. Mozinor, quand tu nous tiens !
  • rusty · 2 years ago
    Bonjour,

    Ce plugin fonctionne très bien chez moi et correspond à ce que je recherchais (les images trop grandes sont redimmentionnées à une taille résonnable) mais j'ai tout de même un problème.
    Je voulais me servir de ce plugin pour afficher des wallpaper.
    Hors une fois les images agrandies, en faisant un click droit je n'ai plus l'option "choisir comme fond d'ecran".
    Est-ce qu'il serait possible de rectifier çà ? Ou alors carrément ajouter un petit bout de code pour avoir une commande "ajouter comme fond d'écran" dans la description de l'image ?

    => voir par ex. ici

    Woilà.

    @+

    Rusty.
  • rusty · 2 years ago
    ah oui non mais de toute façon çà ne va pas aller puisqu'il va reprendre la taille de l'image redimentionnée par le plugin et non la taille réelle...
  • johnnoone · 2 years ago
    Le plugin ne fait pas de vignette redimensionnée. Celle qui est affichée est bien l'originale.

    En fait, l'image est recouverte par 2 éléments transparents qui permettent de faire la navigation survolée.

    Ces deux éléments recouvrant l'image, le menu contextuel de l'image ne peut pas fonctionner.

    Pour cela, il va falloir que tu bidouilles la CSS de ces 2 éléments, pour qu'ils ne recouvrent pas entièrement l'image, voir les masquer définitivement. Voici le code à modifier :
    <coolcode lang="css" linenum="false">#prevLink, #nextLink {
    width: 49%;
    height: 100%;
    display: block;
    }
    #prevLink { left: 0; float: left; }
    #nextLink { right: 0; float: right; }
    </coolcode>
  • rusty · 2 years ago
    Oulaaa... je crois que c'est trop compliqué pour moi, je ne vois pas bien ce qu'il faut faire, bon c'est pas très grave, je vais rester à quelque chose de plus simple en plus çà m'évitera de rajouter encore un plugin de plus !
    Merci quand même ; )

    Bye !
  • oliv · 2 years ago
    j’ai téléchargé le plugin, je l’ai installé et activé.
    C'est SUPER !
    Seulement, le côté diaporama n'est pas très joli. Je voudrais l'enlever mais après moultes essais je ne parviens pas à faire ça correct.
    as-tu des infos à me donner ?
    merci d’avance
  • Jonathan Silberman · 2 years ago
    Awesome plug-in! I've been using it for awhile.
    Can you update the plug-in for Wordpress 2.1? It has stopped adding the rel tag automatically.
  • johnnoone · 2 years ago
    I'm working on it.
  • johnnoone · 2 years ago
    Une beta du plugin est disponible à ce lien http://www.john-noone.com/2007/03/14/le-bout-du...
  • alcorsica · 2 years ago
    Superbe version,
    avec le slideshow qui va bien et qu'aucunes des dizaines d'autres versions testée n'a implémenté (peut-etre me tromps-je. Si oui ; let me know ;)).

    Juste un souci de mon coté...
    La fermeture sur le clique exterieur a apparament des zones non reactives (cotés lateraux de l'image). Y a-t-il un moyen d'y remedier pour que cela tourne aussi bien que la lightbox v2 ?
    Si non, sais tu comment adapter ta fonction diapo ?

    Merci pour ce super taff !
  • chris · 1 year ago
    Bonjour,

    je voudrais utiliser la fonction diaporama dans une "page" dédiée. Or l'envoi des photos dans l'éditeur de la page se fait sans problème mais, lorsque je visualise cette page, il n'y a pas du tout de diaporama (j'ai auparavant activer le plugin).
    Aurais-je oublié une étape???
  • Zibouille · 1 year ago
    Bonjour, j'ai suivi vos conseils pour changer la couleur de la bordure de la miniature... Le problème, c'est que les caractéristiques données s'appliquent à toutes les images de ma page... Je n'y connait vraiment pas grand chose en css, mais ça à l'air vraiment pratique quand on maîtrise!
  • Pierre · 1 year ago
    vous mériteriez plus de comentaires ;)