Ajouter un effet vidéo Fancybox sous WordPress

L’affichage en surimpression de vos vidéos à la manière d’Apple est possible grâce au plugin Easy FancyBox. Ce tutoriel vous montrera comment appliquer cet effet FancyBox en quelques clics.

Aperçu du résultat

L’effet FancyBox fonctionne sur le même principe de surimpression que l’effet ShadowBox.

Capture d'écran - Effet FancyBox à la Apple
Retrouvez cet FancyBox sur notre page Podcasts vidéos

Utilisation de FancyBox

L’effet FancyBox est compatible avec les types de médias suivants : PDF, SWF, YouTube, Vimeo, Dailymotion, iFrames.

Le principe de fonctionnement est basée sur l’auto-détection des liens. Il n’est donc pas nécessaire de modifier les liens à moins de vouloir gérer l’effet en mode manuel. Reportez-vous à la FAQ du plugin.

Installation

Rendez-vous dans le menu Extensions puis Ajouter. Recherchez le plugin Easy FancyBox puis faites Installer maintenant.

Libre à vous de le télécharger à partir du lien suivant si votre hébergeur n’autorise pas l’installation automatique.

Easy FancyBox

Plugin appliquant un effet FancyBox sur les vidéos de votre blog WordPress. Certifié sans faille de sécurité connue par BoiteAWeb.

Taille : 384,8 KiB  •  Date : 19 septembre 2011 •  Hits : 3 793

Options de configuration

Les options du plugin Easy FancyBox sont situées dans Réglages puis Médias, juste en dessous des options de base de WordPress.

Capture d'écran - Options de Easy FancyBox
Libre à vous de personnaliser le plugin à votre convenance
Capture d'écran - Configuration de FancyBox avec YouTube
Les vidéos en provenance de YouTube sont détectées automatiquement

Ces options sont relativement simples à comprendre, je ne vais donc pas les détailler une à une ici.

Toutefois, je vous recommande de :

  • Cocher uniquement les formats qui doivent faire appel à l’effet FancyBox – YouTube dans mon cas, pour alléger le temps de chargement du site ;
  • Limiter les tailles d’affichage concernées à une résolution standard ;

Easy FancyBox propulse la page de podcasts vidéos sur WordPress Channel : un moyen efficace pour afficher des vidéos sans perte de place sur votre site. Cette technique est largement utilisée sur le Web.

Crédits photo : royalconstantinesociety

22 commentaires

  1. sylvain

    Bonsoir, j’aime beaucoup vos podcast !
    J’ai d’ailleurs installer ce plugin avec les mêmes paramètres que les votre.
    Mais impossible de faire fonctionner Easy FancyBox …
    Et je ne sais pas pourquoi, je souhaite l’utiliser seulement pour youtube comme vous.
    Ma config actuelle est WordPress 3.3.1
    et theme Mystique 3.2.9.3

    Merci pour votre réponse.

    1. Aurélien Denis auteur de l’article

      Merci d’apprécier mes podcasts !

      C’est délicat de dépanner sans accès des scripts comme FancyBox, Shadowbox, Ligthbox ou autres. Essayez de repasser avec le thème par défaut pour voir dans un premier temps s’il n’y aurait pas d’incompatibilité.

    2. Jeromeweb78

      Hello,
      J’ai plusieurs fois rencontré une incompatibilité entre easy fancybox et des thèmes achetés chez theme forest.
      « Fancybox » (Par Kevin Sylvestre) est une alternative qui a à chaque fois fonctionné lorsque je rencontrais ce genre de problèmes

  2. mao

    bonjour,
    jene comprend pas j’ai un problème avec cette extension et seulement avec les images celle-ci ne s’affiche pas il y a bien le calque gris mais pas l’image or pour les liens YouTube par exemple ou l’iframe sa fonctionne.

    je cherche désespérément de l’aide pour résoudre ce problème donc si vous avez des direction ou je peut chercher je suis preneur.

  3. Giorgio

    Bonjour, Très bon podcast ! Peut-être que j’aurai une réponse à mon problème ici … Voilà : j’utilise cette extension formidable, version 1.3.4.9. pour mon site de petites annonces. Seulement je trouve qu’il alourdit considérablement le site, surtout au niveau des scripts, easy-fancybox est actif sur toutes les pages du site, or je ne l’utilise que pour les pages « single » (annonces). alors j’aimerais pouvoir activer cette extension uniquement sur les pages « is_single() » (annonces). Quelqu’un aurait une idée ? Merci !

  4. Giorgio

    Bonjour, Très bon podcast ! Peut-être que j’aurai une réponse à mon problème ici … Voilà : j’utilise cette extension formidable, version 1.3.4.9. pour mon site de petites annonces. Seulement je trouve qu’il alourdit considérablement le site, surtout au niveau des scripts, easy-fancybox est actif sur toutes les pages du site, or je ne l’utilise que pour les pages « single » (annonces). alors j’aimerais pouvoir activer cette extension uniquement sur les pages « is_single() » (annonces). Quelqu’un aurait une idée ? Merci !

    1. Aurélien Denis auteur de l’article

      Oui tu peux faire en sorte de limiter l’affichage des scripts sur les pages de ton choix avec des tags conditionnels dans ton function.php.

      Regardes du côté de enqueue_script sur le codex.

      1. Giorgio

        Merci Aurélien pour ta réponse… au fait j’ai écrit quelque chose qui a l’air de fonctionner dans le fichier function.php du template :

        add_action(‘wp_head’,’conditional_script’,0);

        function conditional_script() {
        if (!is_single()) {
        remove_action(‘init’,’easy_fancybox_init’);
        remove_action(‘wp_print_styles’, ‘easy_fancybox_enqueue_styles’, 999);
        remove_action(‘wp_enqueue_scripts’, ‘easy_fancybox_enqueue_scripts’, 999);
        remove_action(‘wp_head’, ‘easy_fancybox’, 999);
        }
        }

        Voilà chez moi ça fonctionne correctement

        1. Aurélien Denis auteur de l’article

          Super merci du retour ! Je pense que j’aurais fait quelque chose dans le même genre quoique un peu différemment. Mais l’essentiel est que les requêtes n’apparaissent plus au chargement du site.

          1. Giorgio

            En effet ! j’ai fait en fonction de mon site mais je pense qu’on pourrait l’adapter pour tout autre Plugin à neutraliser partiellement dans wordpress… encore bravo pour ton site !

  5. Effet FancyBox pour les vidéos, les pdf, les swf… | Support Wordpress

    […] Easy FancyBox fait la même chose que FancyBox for WordPress mais pour tous les types de médias. […]

  6. reflexia

    Bonjour,

    Je cherche un plugin qui permet aux articles de s’ouvrir dans le « Fancybox », Tout en sachant que je ne suis pas DEV

    Merci pour les podcasts Aurélien.

  7. joe

    Bonjour je n’arrive pas à avoir l’effet de superposition pour les vidéos juste pour les photos (la fenetref java qui vient se superposer à la pages.

    J’obtiens juste la vidéo youtube simple comme sur youtube

    comment il faut faire ?

  8. antoinebeu

    Hello ,

    Plugin Fancybox semble ne pas fonctionner avec l’extension que j’utilise pour mes diaporama (cyclone slider ), existe t il une solution au problème ou bien dois je tester un autre slider ?

    Merci bcp !

Laisser un commentaire

Thèmes & Plugins
Premium By WP Channel

WP Alacarte propose des produits et services de qualité
made in France pour la plateforme WordPress.

Tout est prêt pour créer votre site à la carte !

  • Thèmes et extensions premium
  • Facilité d’utilisation garantie
  • Temps de chargement optimisé
  • Personnalisation avancée
Découvrir

Rejoignez la communauté WordPress !

Faites partie de l’aventure en devenant membre d’une association WordPress. Conférences, ateliers, BarCamp, WordCamp… Venez
partager votre passion pour WordPress !

Aurélien DENIS,
président des associations WordPress Francophone et WPMX