FancyBox est une extension qui présente une ou plusieurs images d’une manière plus conviviale que la fonctionnalité de base de WordPress. Il s’agit d’une fenêtre qui « flotte » au-dessus de la page web principale. L’extension dispose, une fois installée, d’un menu de configuration pour effectuer différents réglages sur l’apparence de cette fenêtre.
Auteur : Jose Pardilla.

Comment configurer FancyBox ?

FancyBox peut être utilisée tel quel, sans effectuer de réglages supplémentaires. Toutefois, elle dispose d’un menu de configuration permettant de modifier les paramètres de base (par exemple, les couleurs utilisées pour la présentation).

Pour accéder à l’extension, déroulez le menu « Réglages » dans le menu situé à gauche (menu par défaut de WordPress).
Cliquez ensuite sur « Fancybox for WP »

La page des réglages apparaît. En haut se trouvent plusieurs onglets. Tous les onglets ne sont pas détaillés ici.

Cliquer sur l’image pour agrandir

Les différents onglets sont :

onglet « Info » : présentation de l’extension.
onglet « Appearance » : présentation des différents modes de décoration de la fenêtre FancyBox.
onglet « Animations » : présentation des paramètres pour les phases d’ouverture et de fermeture de la fenêtre.
onglet « Behaviour » : présentation des paramètres de gestion du container (les paramètres par défaut peuvent être conservés).
onglet « Galleries » : présentation du mode de fonctionnement de la galerie photographique dans la fenêtre.
onglet « Other » : présentation des fonctions plus avancées. Par exemple, affichage d’un message à l’ouverture de la fenêtre.
onglet « Troubleshooting » : à utiliser seulement dans le cas de soucis avec l’extension.
onglet « Uninstall » : pour bien nettoyer l’environnement de l’extension dans le cas d’une désinstallation.

Les onglets surtout détaillés sont les suivants :

onglet « Appearance »
onglet « Animations »
onglet « Behaviour »
onglet « Galleries »

Quels sont les réglages de l’onglet « Appearance » ?

Border Color : une bordure (ou filet) entoure ou pas toute la fenêtre FancyBox.

Par défaut « Show Border » n’est pas coché, donc pas de bordure.
Si « Show Border » est coché, définissez la couleur dans le champ au-dessous au format hexadécimal (#BBBBBB par exemple).
Close Button : un bouton de fermeture de la fenêtre est visible ou pas.

Par défaut le bouton « Show Close button » est activé.
Il est possible de définir sa position (haut / bas, gauche / droite).
Padding : un espace entre l’image (ou la photographie) et le bord extérieur de la fenêtre peut être ajouté. Par défaut cet espace est de dix pixels.

« HTML color of the padding » : définissez la couleur au format hexadécimal (#FFFFFF par exemple) dans ce champ.
« Padding size in pixels » : définissez la taille de cette bordure en pixels (10 pixels par défaut).
Overlay Options : lorsque la fenêtre FancyBox s’ouvre, le blog en arrière plan est légèrement caché par un voile plus ou moins opaque.

Par défaut « Add overlay » est activé.
« HTML color of the overlay » : pour choisir la couleur du voile.
Le menu déroulant sert à régler l’opacité du voile (0 = transparent, 1 = opaque).
Show Title : affiche ou non le titre de l’image (ou de la photographie). Il s’agit du titre indiqué au moment de l’insertion de l’image dans l’article.

Cochez la case « Show the image title » pour faire apparaître le titre de l’image.

Quels sont les réglages de l’onglet « Animations » ?

Zoom options : pour changer la transparence pendant les animations et la durée des animations à l’ouverture ou à la fermeture de la fenêtre.

Easing : concerne les effets donnés lors des changements de fenêtre (effet lent, rapide, avec imitation de rebond, élastique, etc …). Les réglages par défaut peuvent être conservés.

Quels sont les réglages de l’onglet « Behaviour » ?

Option intéressante :
Close on Content Click : permet de fermer la fenêtre en cliquant sur l’image et pas seulement sur le bouton fermer.
Les autres options peuvent conserver leur valeur par défaut.

Quels sont les réglages de l’onglet « Galleries » ?

Gallery type :
Make a gallery for all images on the page : toutes les images de la page sont prises en compte.
Make a gallery for each post : toutes les images d’un article sont prises en compte.

Rappel :
Une page contient un ou plusieurs article(s).
Un article est constitué d’un titre, d’un corps d’article et de métadonnées (horodatage, catégories, etc …).
Une ou plusieurs images sont insérées dans un article.