Wordpress SchmancyBox Plugin

Voici le plugin SchmancyBox, qui est en fait le dérivé du plugin FancyBox pour Wordpress.

Si vous utilisez la plateforme Wordpress, vous apprécierez surement cet outil pratique et simple à mettre en place, mais surtout doté d'un effet ultra séduisant.

L'idée originale de cet outil vient du Designer George Wiscombe et un grand merci à lui de m'avoir permit de participer.

© George Wiscombe et Jeremy Desvaux

Démonstration

Implémentation

Une fois téléchargée, décompressez le contenu de l'archive dans le dossier "/wp-content/plugins/", tout en conservant bien le dossier et non juste en ajoutant les fichiers php directement dans "/wp-content/plugins/".

Vous pourrez ensuite activer le plugin à travers la rubrique plugin du menu dans l'interface wordpress.
Vous trouverez ici un tutoriel expliquant comment s'y prendre si besoin.

Une fois le plugin activé, vous pourrez accéder au menu suivant.

C'est à partir de ce menu que vous pourrez changer les paramètres que vous souhaiter.

Class for LightBoxing: Class utilisée pour déclencher la SchmancyBox e.g. "fancy": Chaque lien doté de cette class ouvriront leur cible dans une SchmancyBox
Default iFrame dimensions: Dimensions par défaut de la SchmancyBox.
Overlay Show: Cochez pour montrer l'arrière plan foncé.
Overlay Opacity: Choisissez le degré de transparence de l'arrière plan.
Et finalement, spécifiez si vous voulez cacher le contenu de la SchmancyBox pendant l'animation d'ouverture.

A présent que le plugin est correctement configuré, il ne vous reste plus qu'à créer un lien comme celui-ci dans le contenu de votre page:<a class="fancy" href="/lib/lightbox/photos/image1.jpg"> <img src="/lib/lightbox/photos/thumb_image1.jpg" /> </a>

Vous pouvez aussi télécharger le "Guide d'utilisation", qui contient un peu plus d'informations.

Vous seriez peut être aussi intéressé par::

Poster un Commentaire

Commentaires récents

@Blind.
En fait Blind, si vous avez spécifié la class fancy dans la case 'div for lightboxing', il faut ensuite écrire:
<div class="fancy">
<a href="/lib/lightbox/photos/image1.jpg">
<img src="/lib/lightbox/photos/thumb_image1.jpg" />
</a>
</div>
La différence c'est qu'il faut avoir ce div avec la même classe, avec vos liens (sans classe), dedans.

De jdmweb114352 à 12:17 25/07/10 { Répondre }

Et bien non ça ne marche pas, j'ai bien suivi la méthode pour l'image comme celle ci en spécifiant bien mon chemin pour mes images: <a class="fancy" href="/lib/lightbox/photos/image1.jpg">
<img src="/lib/lightbox/photos/thumb_image1.jpg" />
</a>
Peut-être parce que je suis sous Wordpress 3.0 :/

De Blind à 23:19 24/07/10 { Répondre }

@jdmweb114352. Merci pour votre réponse.
Pourtant c'est bien ce que j'avais compris, j'ai du me tromper dans le code pour l'image, je vais vérifié ça.

Merci beaucoup.

De Blind à 19:29 24/07/10 { Répondre }

@Blind.
Bonjour Blind,
Dans ce paramètre, précisez un nom de classe que vous voulez attribuer à votre div. (par exemple 'gallery' ou SchmancyBox').
La manip sera que le plugin saura du coup que chaque lien qui se trouve dans un div doté de cette classe devra se comporter comme une SchmancyBox, et non pas comme un lien normal.

De jdmweb114352 à 19:26 24/07/10 { Répondre }

Salut,

J'ai un petit problème, je ne comprend pas trop ce que je doit mettre dans les paramètres de SchmancyBox dans "Div for Lightboxing".
PS: je ne connais pas trop les manip pour ce genre de plugin :/

Merci.

De Blind à 15:21 24/07/10 { Répondre }