Divi video autoplay : démarrer une vidéo automatiquement

Comment on peut activer l'autoplay sur une vidéo dans un site Web, c'est-à-dire démarrer automatiquement la vidéo sans que le visiteur ait besoin de cliquer sur le bouton "Play" ? L'objectif est que, dès que le visiteur ouvre la page, la vidéo se lance.

Je vais aborder le cas des vidéos YouTube, intégrées dans n'importe quel site Web.
Et aussi, l'intégration des vidéos YouTube dans WordPress.
Puis, plus spécifiquement, le cas des vidéos intégrées avec Divi :

• les vidéos mp4 intégrées dans un site Divi

• et les vidéos YouTube intégrées dans Divi

Divi est le thème WordPress le plus populaire au monde : voir qu'est-ce que Divi ?

Pour intégrer une vidéo YouTube dans un site Web, on va :

• Se rendre sur la page de la vidéo YouTube

• Cliquer sur Partager

• Puis sur intégrer

• Sélectionner et copier le code HTML qui nous est donné

• Le coller dans notre site à l'endroit adéquat

Pour activer l'autoplay, on va ajouter le paramètre suivant à l'URL de la vidéo YouTube quand on l'intègre :

Par exemple, l'URL YouTube standard suivante :

devient

Attention, si vous avez déjà des paramètres dans votre URL, par exemple :

le paramètre complémentaire s'ajoute alors avec une esperluette, car on ne doit avoir qu'un seul point d'interrogation dans une URL (le premier paramètre d'une URL est précédé d'un point d'interrogation, les suivants d'une esperluette), ce qui donne :

Sans le paramètre autoplay=1 : la vidéo est bien intégrée au site, mais ne se lance pas.

Avec le paramètre autoplay=1 : la vidéo se lance automatiquement au lancement de la page.

Si cela ne marche pas pour vous, il y a 2 causes principales possibles :

• soit vous avez fait une erreur dans l'ajout du paramètre à votre URL

• soit votre navigateur n'autorise pas l'autoplay sur cette vidéo.

Et oui ! Les navigateurs n'acceptent plus qu'un site Web lance des vidéos automatiquement, ça peut fonctionner, mais seulement dans certains cas.

Vous pouvez trouver des informations sur ces restrictions dans cette page du site Google Developers : https://developers.google.com/web/updates/2017/09/autoplay-policy-changes

Et comme c'est en anglais, je vais vous traduire les informations principales :

Changement dans la politique de fonctionnement de l'autoplay dans le navigateur Google Chrome

Le navigateur Chrome a implémenté une mise à jour qui bloque l'autoplay des vidéos.

Les navigateurs intègrent des politiques plus strictes sur l'autoplay des vidéos pour les raisons suivantes :

• améliorer l'expérience des utilisateurs

• minimiser les incitations à installer des bloqueurs de publicités (adblockers)

• et réduire la consommation de données sur des réseaux coûteux et / ou limités

Google explique qu'ils ont bloqué la possibilité d'autoplay sur les vidéos

Ils nous montrent même 2 mèmes à ce sujet, expliqués dans la vidéo en haut de cet article.

En résumé, il y a des mesures de blocage de l'autoplay mises en place par les éditeurs des navigateurs Web.

Ces modifications visent à donner un meilleur contrôle de la lecture aux utilisateurs et à bénéficier aux éditeurs de cas d'utilisation légitimes.

La politique d'autoplay de Chrome fonctionne comme suit :

• L'autoplay de vidéos en sourdine (sans son) est autorisé, avec le son désactivé par défaut

• L'autoplay de vidéos avec le son activé est autorisé si :

  • L'utilisateur a interagi avec le domaine

  • Sur ordinateur de bureau, l'indicateur qui s'appelle "user Media Engagement Index" a passé le seuil d'autorisation, que l'utilisateur a déjà joué une vidéo avec du son

  • Encore sur ordinateur, autoplay est autorisé si l'utilisateur a installé la Progressive Web App du site

  • Sur mobile, l'utilisateur a ajouté le site a leur écran d'accueil

• Les sites peuvent déléguer leurs autorisations de permission aux iframes qu'ils contiennent. Par exemple, intégrer une vidéo YouTube utilise une iframe

On arrive donc dans du cas par cas complexe, sur lequel nous n'avons quasiment aucun contrôle. En gros :

• soit vous laissez tomber l'autoplay si ce n'est pas crucial pour vous

• soit vous le mettez en vous disant que ça marchera pour un visiteur sur deux

• soit vous mettez en sourdine (mute) la vidéo au démarrage, ce qui laisse le choix à l'utilisateur d'activer le son ou non

Voici les explications pour lancer la vidéo sans le son.

Afin de pouvoir jouer automatiquement une vidéo au chargement d'une page, il faut donc couper le son de la vidéo.

Pour ce faire, on ajoute le paramètre mute=1

Ce qui donne, avec le paramètre autoplay :

Ou si vous avez déjà un autre paramètre :

Donc si vous intégrez une vidéo YouTube directement avec son URL, le résultat est :

En inclusion iframe, c'est la mème chose :

Au lieu de :

On va avoir :

Et voilà ! L'autoplay en coupant le son devrait fonctionner à peu près partout.

Voyons maintenant les cas particuliers, selon les outils utilisés : Gutenberg, Divi, YouTube, mp4.

L'éditeur par défaut de WordPress s'appelle Gutenberg, il utilise un système de blocs.

Même dans un site qui utilise Divi, on peut avoir certaines pages construites avec Gutenberg, et d'autres avec Divi. Voyons donc comment jouer une vidéo en autoplay avec Gutenberg.

Il y a plusieurs moyens d'intégrer une vidéo YouTube avec Gutenberg : utiliser un bloc YouTube, un bloc HTML personnalisé, un bloc texte et l'éditer en HTML, etc.

Dans un bloc Gutenberg YouTube, Si vous essayez d'éditer l'URL de la vidéo en faisant "Modifier en HTML", le bloc fera une erreur, comme ceci :

Ajoutez simplement les paramètres d'autoplay et de sourdine à l'URL de votre vidéo :

Exemple :

Démo réelle avec un bloc Gutenberg "HTML personnalisé" :

Le thème WordPress "Divi" est un éditeur visuel de pages Web (Qu'est-ce que Divi ?), qui fonctionne avec des modules. Le module vidéo de Divi permet d'ajouter des vidéos de différentes manières :

• d'intégrer une vidéo externe à partir d'une adresse Web, comme une vidéo YouTube

• de téléverser et héberger sur votre site votre propre vidéo, au format mp4 ou webm

Le module vidéo Divi qui vous permet d'ajouter une vidéo dans vos pages :

Le module vidéo de Divi ne permet pas de lancer une vidéo automatiquement. Pas d'option d'autoplay possible directement.

Pour palier ceci, vous pouvez utiliser un module de code dans Divi au lieu d'un module vidéo, comme expliqué ci-dessous.

Ajoutez un module "Code" à votre page Divi :

Pour jouer une vidéo en boucle, ajoutez simplement le paramètre loop=1 à votre URL YouTube :

Pour cacher les boutons "Play", "Volume", "Plein écran" = les contrôles d'une vidéo YouTube, on lui ajoute le paramètre ?controls=0 (ou &controls=0 si vous avez déjà des paramètres dans l'URL):

On utilise :

Exemple réel, résultat de ce code :

Lorsqu'une vidéo YouTube se termine, elle propose systématiquement d'autres vidéos en suggestions.

Jusqu'à septembre 2018, il était possible de les désactiver avec le paramètre rel=0.

Depuis, YouTube ne propose plus cette option pour enlever les vidéos suggérées.

Toutefois, l'utilisation de ce paramètre permet de limiter les suggestions de vidéos aux vidéos de votre propre chaîne YouTube (de la chaîne YouTube à laquelle la vidéo que vous intégrez appartient).

Exemple d'intégration de ce paramètre rel=0 :

Un autre paramètre utile : modestbranding=1

Ceci enlève le gros logo YouTube de la vidéo. YouTube sera toujours mentionné en petit.

Voici la liste officielle des paramètres utilisables lorsqu'on intègre une vidéo YouTube :

https://developers.google.com/youtube/player_parameters?hl=fr

Si vous utilisez une vidéo mp4 avec le bloc Gutenberg "Video", il y a déjà les options disponibles de lecture automatique et sourdine directement dans WordPress :

Si dans un module vidéo Divi, vous intégrez une vidéo MP4 au lieu d'une URL YouTube, vous n'avez pas la possibilité de mettre un paramètre URL autoplay tout simple, comme avec une URL YouTube.

Pour que la vidéo MP4 intégrée par le module vidéo Divi démarre automatiquement au chargement de la page, sans que le visiteur ait besoin de cliquer sur "Play", il existe un petit code Javascript facile à mettre en oeuvre si vous avez des notions de base en Web.

Javascript, pour résumer simplement, est le langage de programmation qui va avec les sites Web et qui permet de programmer des actions. Cette méthode Javascript fonctionne avec une vidéo mp4 mise dans un module vidéo Divi, mais pas avec une vidéo YouTube mise dans un module vidéo Divi.

Il existe différentes manières d'ajouter du Javascript à une page, nous allons utiliser la plus simple pour l'exemple et lancer la vidéo mp4 automatiquement.

En premier lieu, donnez un identifiant à votre module vidéo, dans l'onglet avancé du module, champ "ID CSS" et retenez-le, ici j'ai mis "mavideo" (voir la vidéo en haut de cet article pour reproduire les manipulations démontrées) :

Explications du code :

jQuery est une librairie Javascript qui facilite et étend le code Javascript. jQuery est déjà intégré dans WordPress.

La première fonction se lance au chargement de la page.

Le dièse signifie qu'on appelle un identifiant.

.et_pb_video_box video signifie qu'on vise la balise video, située dans un conteneur de classe et_pb_video_box, elle-même située dans un conteneur à l'identifiant mavideo.

get(0) sélectionne le premier élément de cette sélection.

play() est la fonction qui lance la vidéo

Pour ce faire, on ajoute dans notre code Javascript la propriété "muted", qui veut dire en sourdine, de la manière suivante :

Pour lancer la lecture en boucle, ajoutez l'attribut loop. Cependant, certains navigateurs refusent de lancer une vidéo en boucle si le son n'est pas désactivé par défaut. Voici donc le code final :

Précision ajoutée par Foucauld le 29 nov 2019

Pour cacher les boutons "Play", "Volume", "Plein écran" ... d'une vidéo affichée avec un module Divi, on ajoute ceci au Javascript :

Ce qui donne, pour autoplay, couper le son au démarrage, et cacher les contrôles :

Si vous travaillez directement en HTML, vous pouvez regarder du côté de l'attribut "autoplay" à appliquer à la balise :

ou

Avec du mp4, module "Curseur de défilement vidéo" (slider de vidéos) à qui on a donné l'identifiant CSS slidervideos

Lance automatiquement la première vidéo du slider :

Lance automatiquement la deuxième vidéo du slider, mais c'est la première qui est visible :

Lance automatiquement la première vidéo du slider, avec sélecteur modifié pour le slider de vidéos :

Ensuite si vous voulez lancer la vidéo du slide en cours au moment où le slide qui contient la vidéo apparaît, il faut trouver l'événement Javascript correspond et y lancer le code play().

Par définition, une vidéo de fond est là pour faire joli : elle n’a pas de contrôles. Elle est donc automatiquement en autoplay et en sourdine. C'est le comportement par défaut des vidéos de fond de Divi, et il n'y a pas d'autres options dans le module.

Si vous regardez le code créé par Divi lorsqu’on met une vidéo en fond, il ressemble à :

Forcer à remettre le son (enlever le « mute ») est possible en Javascript, mais dans ce cas, les navigateurs bloqueront l’autoplay, puisqu’une vidéo en autoplay avec du son est interdite dans la plupart des cas comme vu plus haut.

Il n'est vraiment pas conseillé d'utiliser une vidéo de fond avec du son, la plupart des visiteurs se demanderont d'où vient le son et fermeront la page rapidement.

Oui, trouvez simplement un endroit dans votre page dans lequel vous pouvez inclure du HTML, suivez attentivement les détails de cet article et la vidéo d'explications en haut, vous devriez pouvoir les adapter à votre propre cas.

Le support technique de Divi se trouve à l'endroit où vous avez acheté Divi, sur le site d'Elegant Themes. C'est à eux que vous pouvez vous adresser lorsque vous avez des questions sur votre utilisation de Divi.

Dans la vidéo ci-dessus, je vous explique pourquoi il ne faut pas mettre l'autoplay sur des vidéos.

Depuis, la loi française étudie la possibilité de rendre cet autoplay illégal.

Source : Numérama

Meilleure organisation des titres et paragraphes, corrections, et suppression des textes superflus.

Bonjour, ici Jean de Netologiste.com (maintenant ideoforge.com). Aujourd'hui, je vais vous expliquer comment on peut activer l'autoplay sur une vidéo dans un site web, c'est-à-dire démarrer automatiquement la vidéo sans que le visiteur ait besoin de cliquer sur le bouton play : dès qu'il ouvre la page, la vidéo se lance. Je vais aborder le cas des vidéos YouTube intégrées dans n'importe quel site web, mais aussi l'intégration des vidéos YouTube dans WordPress, puis, plus spécifiquement, le cas des vidéos intégrées avec Divi : les vidéos MP4 intégrées dans un site Divi et les vidéos YouTube intégrées dans Divi. Divi est le thème WordPress le plus populaire au monde. Je vous mets un lien qui explique ce qu'est Divi dans la description de la vidéo.

Intégrer une vidéo dans un site web. Pour intégrer une vidéo YouTube dans un site web, on va se rendre sur la page de la vidéo YouTube, cliquer sur « Partager », puis sur « Intégrer », copier le code HTML qui nous est donné et le coller dans notre site à l'endroit adéquat. Si vous ne savez pas où mettre ce code dans votre site, j'ai fait un tutoriel spécifique pour cela dans la formation « Découvrir Divi ». Je vous mets le lien dans la description de cette vidéo.

Activer l'autoplay. Pour activer l'autoplay, on va ajouter le paramètre suivant à l'URL de la vidéo YouTube quand on l'intègre : un point d'interrogation, autoplay égale 1. Par exemple, l'URL YouTube standard suivante, https://www.youtube.com/ suivi de l'identifiant de la vidéo, devient la même chose à laquelle on ajoute ?autoplay=1. Attention, si vous avez déjà des paramètres dans votre URL, par exemple ?start=6, le paramètre complémentaire s'ajoute à la suite avec une esperluette, car on ne doit avoir qu'un seul point d'interrogation dans une URL. Ce qui donne : ?start=6&autoplay=1.

Si ces histoires d'URL, pour vous, c'est du chinois, pas de panique : je suis en train de préparer des vidéos pour débutants qui expliquent en détail comment sont structurées les URL sur le web. Cela se trouve sur la plateforme d'e-learning app.netologiste.com, avec inscription gratuite. Je vous mets le lien dans la description de cette vidéo. Voici ce que donne la vidéo sans le paramètre autoplay, et avec le paramètre autoplay.

Si cela ne marche pas pour vous, il y a deux causes principales possibles : soit vous avez fait une erreur dans l'ajout du paramètre à votre URL, soit votre navigateur n'autorise pas l'autoplay sur la vidéo. J'explique cela plus loin dans la vidéo, mais restez jusqu'au bout.

Autoplay sur une vidéo YouTube dans Divi. Le thème WordPress Divi est un éditeur visuel de pages web qui fonctionne avec des modules. Le module vidéo de Divi permet d'ajouter des vidéos de différentes manières : soit d'intégrer une vidéo externe à partir d'une adresse web, comme une vidéo YouTube, soit de téléverser et héberger sur votre site votre propre vidéo au format MP4 ou WebM.

Lorsqu'on intègre une vidéo YouTube, en cliquant sur « Ajouter » dans le module, on a deux choix pour la vidéo insérée. À partir d'une adresse web, c'est ici qu'on va vouloir mettre l'URL avec son paramètre autoplay. Mais dans cette utilisation, Divi transforme notre URL en URL d'intégration, avec /embed, pour la mettre dans une iframe, et par là même supprime notre paramètre autoplay. Donc, comme ça, en tout cas dans l'état actuel de la version de Divi, ça ne fonctionne pas.

Ce qu'on peut utiliser comme solution alternative au module vidéo de Divi, qui nous enlève le paramètre de l'URL, c'est de mettre notre code de vidéo YouTube directement dans un module texte, onglet HTML, ou dans un module code, et ici lui rajouter le paramètre autoplay. On voit que la vidéo se lance, même dans l'éditeur de Divi, et puis lorsque je rafraîchis la page publique, ça marche, évidemment, comme tout à l'heure. Si cela ne marche pas pour vous, deux causes possibles : vous avez fait une erreur dans l'ajout du paramètre à votre URL, ou bien votre navigateur n'autorise pas l'autoplay sur les vidéos. J'explique cela dans quelques instants, et restez jusqu'au bout.

Autoplay sur une vidéo MP4 dans Divi. On ajoute une vidéo MP4 dans Divi en faisant « Ajouter » dans le module. Il y a deux solutions possibles pour la vidéo. Première solution, « Sélectionner la vidéo » dans la bibliothèque de médias, si la vidéo est déjà dans les médias de votre site WordPress. Ou deuxième solution, « Téléverser des fichiers », si vous voulez envoyer la vidéo MP4 depuis votre ordinateur vers votre site WordPress.

Ici, nous n'avons pas la possibilité de mettre un paramètre dans l'URL pour l'autoplay, tout simplement comme on l'a fait avec YouTube. Ce qu'on va faire, c'est ajouter un petit code JavaScript qui va lancer la vidéo automatiquement. JavaScript, pour résumer simplement, c'est le langage de programmation qui va avec les sites web et qui permet de programmer des actions. Il existe différentes manières d'ajouter du JavaScript à une page. Nous allons utiliser la plus simple pour cet exemple pour lancer la vidéo automatiquement.

En premier lieu, donnez un identifiant à votre module vidéo, dans l'onglet « Avancé » du module, dans le champ « ID CSS », et retenez cet identifiant. Ici, j'ai mis « ma-video ». Attention, vous ne pouvez pas utiliser d'espace ni de caractères spéciaux dans cet identifiant : utilisez simplement des minuscules sans accent, éventuellement avec des tirets. Et ensuite, ajoutez un module de code. Dans le champ de contenu de ce module de code, ajoutez le code suivant, en remplaçant « ma-video » par l'identifiant que vous avez donné à votre module vidéo. Par exemple, si vous avez nommé votre module vidéo « video-du-chat », remplacez « ma-video » par « video-du-chat » dans le JavaScript aussi. Dans votre JavaScript, pensez à laisser le dièse avant l'identifiant.

Ici, on utilise jQuery, que je prononce à tort « jiquery ». jQuery est une librairie JavaScript qui facilite et étend le code JavaScript. jQuery est déjà intégré dans WordPress, vous n'avez pas besoin de l'installer. Je vous mets le lien vers ce code à copier-coller dans la description de la vidéo, et je vous explique rapidement. La balise HTML script déclare le fait que nous allons écrire du code JavaScript à la place du code HTML. La fonction jQuery remplace la fonction dollar habituelle de jQuery, afin d'être compatible avec l'implémentation de jQuery de WordPress. jQuery document point ready est la forme courte de « document.ready », qui est l'événement lancé lorsque la page est chargée, c'est-à-dire que notre code va se lancer lorsque la page sera chargée.

jQuery « #ma-video video », c'est simple, c'est un sélecteur. Le dièse signifie qu'on appelle un identifiant, le point signifie qu'on appelle une classe, et lorsqu'il n'y a ni dièse ni point, cela signifie qu'on appelle une balise HTML.

Ce sélecteur signifie qu'on vise la balise vidéo elle-même, située dans un conteneur de classe « et_pb_video_box », elle-même située dans un conteneur à l'identifiant « ma-video ». « get(0) » sélectionne le premier élément de cette sélection, qui ici est la première occurrence de la balise vidéo, « play » est la fonction qui lance la vidéo. Si vous travaillez directement en HTML, vous pouvez regarder du côté de l'attribut autoplay à appliquer à la balise vidéo.

J'ai tout bien fait mais ça ne marche pas. Eh oui, les navigateurs n'acceptent plus qu'un site web lance des vidéos automatiquement. Ça peut fonctionner, mais seulement dans certains cas. Vous pouvez trouver des informations sur ces restrictions dans cette page du site Google Developers. Et comme c'est en anglais, je vais vous traduire les informations principales. Changement dans la politique de fonctionnement de l'autoplay dans le navigateur Google Chrome : le navigateur Chrome a implémenté une mise à jour qui bloque l'autoplay des vidéos. Le navigateur intègre des politiques plus strictes sur l'autoplay des vidéos pour les raisons suivantes : améliorer l'expérience des utilisateurs, minimiser les incitations à installer des bloqueurs de publicité, réduire la consommation de données sur des réseaux coûteux ou limités.

Ils nous montrent deux mèmes à ce sujet. Le premier : « I will find you and I will kill you ». C'est assez intéressant de comprendre cette image, car elle résume à elle seule les mesures de blocage de l'autoplay mises en place par les éditeurs de navigateurs web.

Dans cette image, on voit Liam Neeson, le héros du film Taken, dans lequel sa fille se fait kidnapper. Il arrive à avoir le kidnappeur au téléphone et il lui fait un speech qui est devenu viral : « I don't know who you are, I don't know what you want... I will look for you, I will find you, and I will kill you. » En gros, le héros du film n'a rien demandé à personne, mais sa fille s'est fait kidnapper et il va tout faire pour la retrouver et tuer le kidnappeur.

Le parallèle qui est fait ici, c'est que parfois il y a du son qui se lance dans votre navigateur web sans qu'on ait rien demandé, et on ne sait pas d'où il vient.

Peut-être que vous avez déjà vécu cette situation, c'est très perturbant. On se met à chercher partout d'où vient ce son, en cherchant chaque onglet, on défile dans les pages, on cherche la vidéo pour l'arrêter. Cette phrase, « I will find you and I will pause you », donne en français : « Je vais te trouver et je vais te mettre en pause ». Ce premier mème illustre l'agacement des vidéos qui se lancent toutes seules avec le son, pour justifier le fait que les navigateurs n'autorisent plus toujours l'autoplay des vidéos.

Dans le deuxième mème, c'est Boromir, du film Le Seigneur des anneaux, qui dit : « One does not simply autoplay video ». Dans la conversation du film à laquelle ce mème fait référence, quelqu'un dit qu'il faut emmener l'anneau au Mordor. Dans le film, le Mordor, c'est le territoire des méchants, et Boromir répond : « One does not simply walk into Mordor. » Cette phrase est devenue un mème pour illustrer quelque chose qu'on ne peut pas faire ou qui est difficile à faire. Par exemple, si je vous dis : « Vous n'avez qu'à quitter votre emploi salarié, créer votre entreprise et aller vivre où vous voulez, n'importe où dans le monde », on pourrait répondre : « One does not simply quit this job ».

Dans l'utilisation de ce mème qui est faite ici, c'est ambigu. Ça peut vouloir dire : on ne lance pas de vidéo en autoplay, tout simplement, ça ne se fait pas. Ou : ce n'est pas simple de lancer des vidéos en autoplay. Et effectivement, ce n'est pas simple de lancer des vidéos en autoplay, lorsqu'on lit les explications qui suivent.

Ces modifications visent à donner un meilleur contrôle de la lecture aux utilisateurs et à bénéficier aux éditeurs de cas d'utilisation légitime. La politique d'autoplay de Chrome fonctionne comme cela. L'autoplay de vidéos en sourdine est toujours autorisé. L'autoplay de vidéos avec le son activé est autorisé si l'utilisateur interagit avec le domaine. Sur ordinateur de bureau, l'indicateur qui s'appelle « Media Engagement Index » a passé le seuil d'autorisation, ou l'utilisateur a déjà joué une vidéo avec du son. Sur ordinateur de bureau, l'autoplay est aussi autorisé si l'utilisateur a installé la progressive web app du site.

Sur mobile, l'utilisateur a ajouté le site à son écran d'accueil. Les sites peuvent déléguer leur autorisation de lecture aux iframes qu'ils contiennent : par exemple, intégrer une vidéo YouTube utilise une iframe.

Bon, je vous laisse vous amuser avec ces explications. En gros, soit vous laissez tomber l'autoplay, parce que ce n'est pas crucial pour vous. Soit vous le mettez avec mes explications ci-dessus, en vous disant que ça marchera pour un visiteur sur deux. Soit vous le mettez, et la vidéo, vous la mettez en sourdine, ce qui laisse le choix à l'utilisateur d'activer le son ou non.

Et maintenant, voici les explications pour lancer la vidéo en sourdine, sans le son. Lancer une vidéo YouTube sans le son : pour cela, on va ajouter le paramètre mute=1. Ce qui donne, avec le paramètre autoplay : ?autoplay=1&mute=1. Ou, si vous avez déjà un autre paramètre dans l'URL, comme start par exemple : ?start=6&autoplay=1&mute=1. Donc, si vous intégrez une vidéo YouTube directement avec son URL, le résultat est le même qu'en inclusion dans une iframe.

Voyons maintenant comment modifier notre code pour intégrer la vidéo MP4 sans le son au démarrage. Pour ce faire, on ajoute dans notre code JavaScript la propriété muted, qui veut dire « en sourdine », de la manière suivante : on va ajouter la ligne avec la fonction prop et la propriété « muted » à true. « Prop » veut dire propriété, « muted » veut dire en sourdine, et « true » veut dire vrai.

Voilà, si ces explications vous ont plu, je réalise des centaines de vidéos comme ça, mais je ne les mets pas sur YouTube. Vous les trouverez dans la plateforme d'e-learning qui se trouve à l'adresse app.netologiste.com. L'inscription est gratuite, il vous suffit d'une adresse email. Et au fait, pensez à mettre un pouce vers le haut et à vous abonner à cette chaîne YouTube. À bientôt pour d'autres aventures !

Bonjour ! Vous utilisez Divi sur votre site web ou sur les sites web de vos clients ? Divi est un outil qui se branche sur WordPress et qui permet de créer la mise en page des sites web plus facilement et plus rapidement, sans faire de code, afin de pouvoir se concentrer sur le contenu de vos pages plutôt que sur la technique.

Cependant, il y a une courbe d'apprentissage à Divi. On pense pouvoir créer des pages web en quelques clics, mais on se retrouve face à des difficultés techniques : des pages décalées, des choses qui marchent pas comme on le voudrait. Alors on va chercher des tutoriels sur Google, sur YouTube, on attrape des petits bouts d'information par-ci par-là pour résoudre des problématiques une à une, mais il nous manque une approche globale et on se sent pas en maîtrise de sa mise en page.

C'est peut-être votre cas, et c'est normal : vous n'êtes pas tout seul. Pour bien utiliser Divi, il est essentiel de comprendre comment fonctionnent les pages web en général, et de s'habituer à l'utilisation de Divi en s'entraînant, en apprenant.

En tant que professionnel ayant travaillé à temps plein sur plus de 500 sites web au cours des 20 dernières années, dont plus d'une centaine réalisés avec Divi, j'ai accompagné des entreprises et des freelances qui faisaient leur propre site web. J'ai pu identifier les obstacles auxquels les gens sont confrontés avec Divi. À chaque fois, je répare leurs pages qui sont cassées, et à chaque fois ce sont les mêmes erreurs qui avaient été faites. J'ai donc décidé de créer cette formation intitulée « Mieux utiliser Divi » pour vous partager mon expérience et pour vous aider à mieux construire vos pages, plus rapidement, plus simplement, plus facilement.

Je vous fais part des erreurs les plus fréquentes que j'ai pu observer dans des sites Divi, afin de vous faire gagner du temps et de vous éviter les problèmes fréquents et les erreurs souvent rencontrées. Cette formation est un atelier dans lequel je crée devant vous une page Divi bien construite. Vous me suivez en train de travailler sur une page depuis zéro, et j'explique toutes les étapes et toutes les réflexions lors de la construction de la page.

La page que nous allons créer ensemble pendant cette formation est une page complète, faite de manière claire et efficace. Elle est facile à créer, facile à maintenir, facile à faire évoluer. Vous pouvez la reproduire sur votre site et même l'utiliser comme base pour faire vos sites et vos pages Divi. En plus de cela, je crée également de nombreux designs et mises en page devant vous, étape par étape, pour vous donner des idées et vous expliquer leur fonctionnement.

Grâce aux bonnes pratiques que nous mettrons en place lors de la construction de la page, la version responsive, l'affichage mobile, sera très facile à gérer. Je vous partage ma méthodologie, des bonnes pratiques, je vous explique des mauvaises pratiques à éviter, je vous partage le chemin de réflexion pour construire la page et chaque détail qui la compose. Je vous sensibilise sur des questions Divi, WordPress et web en général. Parfois on rencontre des bugs ou des choses qui marchent pas comme on l'attendait : je vous montre mon approche pour résoudre ces obstacles.

J'ai également pris en compte vos retours suite à mes formations précédentes. Je vous ai écouté ! Sous chaque vidéo, j'ai résumé les points importants de la vidéo. Vous pouvez suivre la formation une seule fois et simplement copier-coller les notes que j'ai préparées pour vous, comme ça vous n'avez pas besoin de revenir dans les vidéos sans arrêt. Aussi, le rythme de la formation est un peu moins rapide que les précédentes : vous avez plus de temps pour suivre. Puis bien sûr, vous pouvez toujours mettre les vidéos en pause quand vous le souhaitez.

Cette formation est différente, car je vous donne des astuces et des réflexions que vous ne verrez pas forcément dans d'autres tutoriels. À travers une approche simple, adaptée aux débutants, vous allez gagner du temps, vous allez éviter des problèmes à long terme, et vous allez avoir des pages Divi mieux construites et évolutives.

Vous pouvez lire ci-dessous les témoignages des personnes qui travaillent avec moi ou qui ont suivi mes formations. Je vous invite à découvrir le programme détaillé de la formation ci-dessous. J'espère que ça vous plaira et que ce travail vous permettra de progresser dans la gestion de votre site web. Merci, et à bientôt !