Les vidéos sont idéales pour améliorer l'engagement des utilisateurs sur votre site Web. Cependant, l'un des inconvénients de l'intégration de vidéos est qu'elle ralentit votre site Web. Dans cet article, nous allons vous montrer comment ajouter du chargement paresseux pour les vidéos dans WordPress et améliorer la vitesse de votre page.

Comment fonctionne le Lazy Loading pour les vidéos ?

Chargement paresseux pour les vidéos

Vous vous demandez ce qu'est exactement le chargement paresseux et comment ça marche ?

Lorsque vous intégrez une vidéo sur votre site, vous ajoutez des scripts et des fichiers externes supplémentaires qui doivent être chargés. Comme il y a plus à charger, votre site Web se charge plus lentement.

Le chargement paresseux vidéo remplace les vidéos Youtube et Vimeo intégrées par une image d'aperçu cliquable. Lorsque vos visiteurs cliquent sur l'image, celle-ci se charge et lit la vidéo.

Étant donné que les images sont beaucoup plus petites que les vidéos, la technique de chargement paresseux améliore considérablement la vitesse de la page.

Maintenant que vous connaissez les avantages, voyons comment charger paresseusement des vidéos YouTube et Vimeo dans WordPress.

Didacticiel vidéo

Abonnez-vous à WPBeginner

Si vous n'aimez pas la vidéo ou avez besoin de plus d'instructions, continuez à lire.

Comment ajouter le chargement paresseux pour les vidéos dans WordPress

La première chose que vous devez faire est d'installer et d'activer le Lazy Load pour les vidéos brancher.

Ce plugin fonctionne prêt à l'emploi et vous n'avez pas besoin de modifier de scripts jQuery à chargement paresseux ou de code d'ailleurs.

Pour voir que votre chargement paresseux fonctionne, il vous suffit de visualiser une publication ou une page contenant une vidéo YouTube ou Vimeo. Vous remarquerez que les lecteurs par défaut sont remplacés par une vignette vidéo et un bouton de lecture.

Une vidéo de chargement paresseux avec vignette et bouton de lecture

Lorsque vous cliquez sur l'image, elle charge la vidéo et la lit.

Il peut y avoir une légère seconde (négligeable) de retard dans le chargement de la vidéo, alors ne pensez pas que le chargement paresseux ne fonctionne pas.

Même si ce plugin fonctionne prêt à l'emploi, il existe toujours des paramètres que vous pouvez configurer en fonction de vos besoins.

Sur l'écran de l'éditeur de publication, vous pouvez choisir la qualité des vignettes pour les intégrations vidéo YouTube.

Contrôle de la qualité des vignettes YouTube pour les publications et les pages

Outre la qualité des vignettes, d'autres options de personnalisation sont disponibles si vous vous dirigez vers Paramètres » Lazy Load pour les vidéos.

Page de paramètres pour le chargement paresseux du plugin WordPress pour les vidéos

Dans l'onglet des paramètres généraux, vous pouvez personnaliser l'apparence des vignettes vidéo. Vous pouvez activer le mode réactif, choisir le style du bouton de lecture, utiliser un CSS personnalisé et même activer le balisage schema.org.

Ce plugin prend en charge à la fois YouTube et Vimeo. Vous pouvez trouver les paramètres spécifiques au fournisseur en cliquant sur les onglets respectifs.

Dans l'onglet YouTube, vous pouvez choisir les couleurs, la qualité des vignettes, désactiver les vidéos et les annotations associées, etc. Vous pouvez même désactiver le chargement différé pour les vidéos YouTube.

Lazy load pour les paramètres YouTube

De même, dans l'onglet Paramètres Vimeo, vous pouvez choisir les couleurs de contrôle, masquer ou afficher le titre de la vidéo et désactiver le chargement différé pour les vidéos Vimeo.

Chargement paresseux pour Vimeo

C'est tout. Nous espérons que cet article vous a aidé à ajouter un chargement paresseux pour les vidéos dans WordPress.

Pour augmenter encore la vitesse de votre site Web, vous devrez configurer une solution WordPress CDN avec le plugin W3 Total Cache.

Si cet article vous a plu, abonnez-vous à notre Chaîne Youtube pour les didacticiels vidéo WordPress. Vous pouvez également nous retrouver sur Twitter et Google+.

Laisser un commentaire