SPIP-Contrib

SPIP-Contrib

عربي | Deutsch | English | Español | français | italiano

274 Plugins, 192 contribs sur SPIP-Zone, 253 visiteurs en ce moment

Accueil > Affichage multimédia > Images > Images réactives > Cloudzoom > Cloudzoom

Cloudzoom

12 novembre 2010 – par Yves Costiou – 33 commentaires

7 votes

le plugin propose une variante au modèle doc permettant de créer des vignettes zoomables dans vos articles

source

Il s’agit de la mise en plugin spip du plugin jquery cloud zoom disponible à cette adresse http://www.professorcloud.com/mainsite/cloud-zoom.htm

Le plugin jquery cloudzoom est publié sous licence MIT

Cloud Zoom, Copyright (c) 2010, R Cecco, www.professorcloud.com
Licensed under the MIT License

Installation

L’installation se fait de manière classique (voir guide d’installation sur spip.net).

Définition des paramètres d’affichage

Un formulaire vous permet de régler vos paramètres. Vous y accédez par l’icône CFG dans la liste des plugins.

Les paramètres sont les suivants :

  • zoomwidth : la largeur de la fenêtre du zoom (en l’absence de valeur définie, la largeur de la mimiature s’appliquera)
  • zoomheight : la hauteur de la fenêtre du zoom (en l’absence de valeur définie, la hauteur de la mimiature s’appliquera)
  • position : peut prendre 5 valeurs
    • gauche
    • droite
    • haut
    • bas
    • à’l’intérieur (dans ce cas le zoom s’affiche dans la miniature)
  • adjustx : décalage sur x de la fenêtre du zoom par rapport à la miniature
  • adjusty : décalage sur y de la fenêtre du zoom par rapport à la miniature
  • tint : lors du survol vous pouvez teinter la miniature de la couleur de votre choix. laissez vide si vous utilisez le softfocus
  • tint opacity : opacité de la teinte (0 transparent à 1 opaque)
  • lens opacity : opacité de la loupe (0 à 1)
  • softfocus : crée un flou sur la miniature au survol de la loupe (incompatible avec tint)
  • showtitle : affiche (ou non) le titre dans la fenêtre de zoom
  • title opacity : opacité du bloc titre (de 0 à 1)

utilisation

Un fois installé et paramétré, il vous suffit d’ajouter une image (celle de grande taille) à votre article, puis de passer celle-ci en mode document (ajouter au portfolio), lui joindre une vignette personnalisée (la miniature).

2 modèles sont utilisables

Un modèle pour une seule image

Pour insérer la miniature dans l’article utilisez

  1. <docXX|zoom>

variante de

  1. <docXX>

Bien sur vous pouvez lui passer en paramètre (left/right/center)

  1. <docXX|zoom|left>

Un modèle pour plusieurs images

Une galerie d’image zoomable peut être appelé par le modèle suivant

  1. <zoompanel|id=XX,YY,ZZ>

où XX YY ZZ est le numéro du document appelé. Ils doivent être séparés par des virgules.

limite

La largeur et la hauteur du bloc de zoom ne peut excéder la largeur et la hauteur du bloc conteneur.

Mise à jour

avril 2012 :
-  Le plugin a été mis à jour afin d’assurer la compatibilité avec spip 2 comme spip 3. Pour celà, il abandonne l’utilisation de CFG pour le paramétrage.
-  ajout d’un second modèle

Retour en haut de la page

Vos commentaires

  • Le 15 novembre 2010 à 19:46, par Reyatem En réponse à : Cloudzoom

    Fonctionne super avec Chromium et Firefox mais pas avec IE 9. Décidément Microsoft... Super plugin que je vais utiliser en sciences, merci !!!

    • Le 15 novembre 2010 à 20:12, par Yves Costiou En réponse à : Cloudzoom

      je m’en vais de ce pas intaller un IE9 pour le test , mais j’ai pu tester sous IE 8 et ça passait

    • Le 15 novembre 2010 à 20:19, par Yves Costiou En réponse à : Cloudzoom

      je me réponds à moi-même ! c’est mort pour tester sous IE9, dont la beta n’est disponible que sous vista ou 7. or seul un xp sous la main

    • Le 4 janvier à 15:35, par soulier En réponse à : Cloudzoom

      Bonjour,
      Sous IE9 il semble que ce superbe plugin ne fonctionne pas ,
      Une évoluton est-elle prévue ? Beaucoup d’internautes utilisent IE et non Fifefox
      Merci

    • Le 4 janvier à 18:10, par Reyatem En réponse à : Cloudzoom

      Finalement fonctionne sous IE9, il faut le mettre en mode affichage de compatibilité.

    • Le 4 janvier à 20:49, par Soulier En réponse à : Cloudzoom

      Bonsoir
      Le mode affichage de compatibilité ne change rien
      Merci
      voir
      cordialement

    • Le 5 janvier à 09:51, par reyatem En réponse à : Cloudzoom

      Si, cela change, mais pas avec Sarka-SPIP 3.0.8 [54368], car la configuration de spip n’est plus la même. Il faut configurer autrement. Va voir par exemple « Une nouvelle version beta de SPIP 3 vient de sortir. C’est la seconde à ce jour. Pour ceux qui le souhaitent [1], vous pouvez tester cette nouvelle version en téléchargeant et en installant SPIP 3 beta 2 avec le zip présent sur files.spip.org »

    • Le 5 janvier à 10:21, par Soulier En réponse à : Cloudzoom

      Bonjour
      Merci beaucoup
      Je n’ai pas de site vraiment de test alors je vais patienter jusqu’à la version de production définitive.
      Bonne journée
      Cordialement

    • Le 11 avril à 16:40, par Yves Costiou En réponse à : Cloudzoom

      Une version compatible SPIP2/SPIP3 sort prochainement. tout est prêt, il ne reste plus qu’à commiter sur la zone.

    • Le 14 avril à 09:45, par Yves Costiou En réponse à : Cloudzoom

      version spip 3 dispo en test (rev 60356)

    Répondre à ce message

  • Le 1er août 2011 à 19:50, par Soulier En réponse à : Cloudzoom

    Bonjour
    Superbe plugin
    Je suis très intéressé par votre évolution programmée de :
    Permettre de passer des paramètres au modèle pour modifier ponctuellement les valeurs renseignées via CFG
    Avez-vous une date prévisionnelle de mise à disposition ?
    Merci
    Cordialement.

    • Le 2 août 2011 à 07:59, par Yves Costiou En réponse à : Cloudzoom

      J’avoue que je ne sais pas exactement quand j’aurais le temps de m’y mettre. Différentes raisons m’empêchent en ce moment de m’investir comme je le voudrais. J’espère fin août début septembre, mais le plugin est sur la zone alors quelqu’un veut le modifier, aucun problème.

      Je suis sincèrement désolé mais pour l’instant je ne peux pas dire mieux

    • Le 7 décembre 2011 à 08:36, par ? En réponse à : Cloudzoom

      Bonjour,
      Y aurait-il une incompatibilité entre Cloudzoom et la versio SPIP 2.1.12 (18732), SARKA 3.0.8 (54368) car la vignette docxx miseen portfolio ne se réduit pas à l’affichage.

      Exemple
      Merci d’avance
      Cordialement

    • Le 7 décembre 2011 à 09:49, par Yves Costiou En réponse à : Cloudzoom

      Bonjour,

      La vignette personnalisée utilisée ne bénéficie pas de traitement automatique. En attendant mieux, il vous faudra utiliser un éditeur externe pour créer une miniature de votre image.

      ... il faut vraiment que je prenne le temps de le retravailler...

      Cordialement

    • Le 7 décembre 2011 à 10:02, par ? En réponse à : Cloudzoom

      Re-Bonjour
      J’avous n’être qu’’un utilisateur lambda et ne pas tout comprendre.
      Sur un site ça marche
      site1
      Sur un autre site ça marche pas et je crois pourtant faire la même chose
      Site2
      Désolé de vous déranger mais ce plugin est tellement superbe
      Cordialement

    • Le 7 décembre 2011 à 10:39, par Yves Costiou En réponse à : Cloudzoom

      En regardant vos deux exemples, l’une de vos vignette personnalisées (site1) est de taille réduite (150*111 px), l’autre (site2) est beaucoup plus grande (800*724 px).

      Mon conseil en l’état serait de créer la vignette (avec gimp par exemple) avant de la placer sur le site

    • Le 7 décembre 2011 à 15:50, par ? En réponse à : Cloudzoom

      Merci de me répondre mais je ne comprends toujours pas aussi je suis désolé de vous déranger.
      Site 1
      j’ai déposé l’image dans le portfolio (1400*1035) et je l’appelle dans la rubrique par
      et là ça marche..
      Site 2
      j’ai déposé l’image dans le portfolio (800*1974) et je l’appelle par et là ça marche pas ?
      A priori je n’ai qu’une image et je ne fais pas le lien entre vignette et image ???
      Cordialement

    • Le 7 décembre 2011 à 16:52, par Yves Costiou En réponse à : Cloudzoom

      En fait la procédure est de déposer l’image (grand format) dans le portfolio PUIS d’y adjoindre une vignette personnalisée (une miniature de votre image que vous aurez préalablement préparé (réduit).

      Je ne sais pas si celà vous éclaire ... tenez-moi au courant

    • Le 7 décembre 2011 à 17:28, par gs En réponse à : Cloudzoom

      Merci mille fois de votre patience et de votre compréhension
      CA MARCHE PARFAITEMENT
      Cordialement

    Répondre à ce message

  • Le 7 juin 2011 à 06:29, par norbi90160 En réponse à : Cloudzoom

    Bonjour,

    Intéressé par ce plugin j’essaie de le mettre en application.

    La taille de la vignette correspond à celle définie par défaut dans les paramètres avancés (150 px dans mon cas).

    Je voudrais savoir, s’il était possible de forcer temporairement la taille de la vignette avant d’appliquer le zoom ?

    Merci de votre retour.

    • Le 7 juin 2011 à 22:30, par Yves Costiou En réponse à : Cloudzoom

      Bonjour,

      En l’état le plugin ne prévoit pas de pouvoir personnaliser la taille de miniature.
      mais je vais remettre le nez dedans ce WE si je peux

    Répondre à ce message

  • Le 10 mars 2011 à 23:19, par ? En réponse à : Cloudzoom

    Comment fait-on pour ajouter un lien attaché à l’image ?
    Merci

    Répondre à ce message

  • Le 16 novembre 2010 à 11:33, par Reyatem En réponse à : Cloudzoom

    Je rectifie, fonctionne sous IE 9 à la condition d’utiliser le mode de compatibilité. C’est super ! Merci encore.

    Répondre à ce message

  • Le 15 novembre 2010 à 22:59, par aRT En réponse à : Cloudzoom

    Très sympa comme contrib,

    Dès que je suis dans la partie portfolio de mon site je teste :)

    Merci du boulot.

    • Le 16 novembre 2010 à 08:50, par Yves Costiou En réponse à : Cloudzoom

      c’est plutot Raff Cecco de professorcloud qui est à remercier. je n’ai fais que mettre en plugin spip son travail

    • Le 16 novembre 2010 à 09:27, par aRT En réponse à : Cloudzoom

      je suis d’accord :) Mais c’est toujours bien de partager ses trouvailles et de les adapter a spip :)

    Répondre à ce message

  • Le 13 novembre 2010 à 19:23, par KMk En réponse à : Cloudzoom

    Bonjour,

    Epoustouflée par cette fonctionnalité, je viens de la tester, mais pas d’effet de loupe. J’ai désactivé la médiabox, mais pas plus d’effet au passage de la souris.

    La configuration :

    • spip 2.1.0 [15604]
    • ... et une liste de plugins assez longue !

    Cette contribution est récente et vous indiquez bien qu’elle est en chantier : peut-être n’avez-vous pas encore tout testé ? Si vous avez besoin de plus d’informations sur la config de test et que cela peut vous aider un tant soit peu, n’hésitez pas à demander.

    Cordialement,

    KMk

    • Le 13 novembre 2010 à 21:14, par Yves Costiou En réponse à : Cloudzoom

      bonjour,

      je suis bien évidemment preneur d’informations sur votre configuration (liste de plugins)

      Une petite question tout de même : est-ce que rien n’apparait ou est-ce que vous n’avez que le cadre de la loupe dans la vignette ?

    • Le 14 novembre 2010 à 12:14, par KMk En réponse à : Cloudzoom

      Bonjour,

      J’ai eu une petite idée en passant : je me suis dit que peut-être mon image était d’un format trop lourd, alors je l’ai réduite (700 px de haut). Mais non, cela ne vient pas de là. Apparaît bien, sous l’image, « zoomer sur l’image », mais au passage de la souris, rien, si ce n’est le texte alternatif du titre de l’image. J’ai publié l’article dans lequel j’ai fait le test en l’antidatant : Voir l’article

      La liste des plugins activées, en plus des squelettes :

      Acces Restreint

      Creer des Alias d’articles

      API de vérification

      Barre Typo V2 pour 1.9.2 et suivantes

      cfg : moteur de configuration

      cloudzoom

      Compositions

      Cooliris pour SPIP

      Corbeille

      Des jeux dans vos articles

      Didaspip

      Enluminures typographiques pour SPIP 2 & Porte plume

      Facteur

      Formidable, générateur de formulaires

      Formulaires&Tables (SPIP 2.0+)

      FreepapeR 2

      Intégration d’activités Freemind

      jFlipBook : Livre d’images avec effet de pages tournantes

      Mon squelette sous forme de plugin

      Le Couteau Suisse

      Lecteur Multimédia en Flash (MP3,flv)

      MediaBox

      Mediathèque

      Menus

      MultiViewer FULL pour SPIP 2.0

      Nuage

      Palette

      Panosalado Modele

      Portail Web pour PMB

      Prévisualisation pour les articles en cours de rédaction

      Saisies pour formulaires

      Secteurs Exclus

      SPIP Bonux

      SPIP-Listes

      SPIP-Surcharges

      SpiPDF

      Splickrbox

      SWFObject

      Tablesorter pour SPIP

      Thickbox v2

      WebFonts

      XSPF : Liste de documents XSPF et modèles de lecteurs multimédia

      YAML

      Je ne sais pas si cela va vous éclairer...

      Cordialement,

      KMk.

    • Le 14 novembre 2010 à 12:34, par KMk En réponse à : Cloudzoom

      Re-

      Je me réponds à moi-même : j’ai fait un test avec une configuration du plugin dans cfg par défaut... et cela fonctionne. Bon, je vais me pencher sur la question...

      Bonne fin de journée !

      KMk.

    • Le 14 novembre 2010 à 19:03, par Yves Costiou En réponse à : Cloudzoom

      bonjour,

      visiblement celà fonctionne chez vous. petite tentative d’explicatrion : comme je l’indique dans les limites, le bloc ne peut apparaitre que dans les limites du conteneur donc si votre vignette était aligné à gauche du bloc, et que cloudzoom était configuré pour afficher le zoom à gauche de la vignette. En apparence il ne se passait rien.
      pour une image contre le bord gauche, il faut paramétrer l’affichage à droite de la vignette pour qu’il puisse être visible

    Répondre à ce message

  • Le 13 novembre 2010 à 23:50, par Yves Costiou En réponse à : Cloudzoom

    je viens de tester sur un SPIP 2.1.0 [15608] tout nu en local et pour moi ça fonctionne. Je suis d’autant plus preneur de votre config.

    Par contre, le test sur un SPIP 2.0.0 et 2.0.5 montre que le plugin est incompatible en l’état

    Répondre à ce message

Répondre à cet article

Qui êtes-vous ?

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 Les choses à faire avant de poser une question (Prolégomènes aux rapports de bugs. )
Ajouter un document

Retour en haut de la page

Ça discute par ici

  • MediaBox

    10 mai 2010 – 192 commentaires

    Aperçu La MediaBox est une Boîte multimédia polyvalente et personnalisable. Le plugin est basé sur la librairie moderne ColorBox, qui a été enrichie et adaptée pour SPIP. Par défaut, mediabox propose 5 habillages. Il est assez facile d’en créer de (...)

  • Analyclick - un compteur de téléchargements

    26 février 2011 – 58 commentaires

    Ce plugin permet de compter les téléchargements de documents sur son site. Il introduit une balise #URL_DOC_COMPTEUR qui va compter chaque clic fait sur ce lien. Il affiche une page de statistique. Installation Le plugin s’installe comme tout (...)

  • Plugin SPIPAL

    10 janvier 2011 – 84 commentaires

    Pour intégrer un système de paiement immédiat via PayPal à certains de vos articles . Ce plugin est une mise à niveau pour la version SPIP 2.1.8 du Plugin GoPayPal qui était resté en SPIP 1.9.2 depuis 3 ans. Il change de nom pour ne pas faire trop (...)

  • SPIP 3.0

    19 mai – 13 commentaires

    Nous avons le plaisir de vous annoncer la sortie de SPIP 3.0 ! Cette nouvelle version vous permet toujours de publier du contenu pour internet et de créer des sites avec une grande facilité. De nombreuses évolutions facilitent son utilisation (...)

  • Les Boîtes Privées

    3 janvier 2008 – 24 commentaires

    Les « Boîtes Privées » sont des cadres qui peuvent apparaître selon vos souhaits ici ou là dans la partie privée de votre site et vous donner des renseignements parfois fort utiles : Les articles au format SPIP, Les auteurs en stat, Les URLs propres, (...)