Comment centrer une vidéo Youtube dans WordPress

Photo of author
Écrit par Grégory Hénique

Mon goût pour la liberté : internet, lectures, culture, et quelques tutos utiles.

EDIT du 02/03/2018 :

Je vous livre telle quelle une autre astuce intéressante :

Celle de vous rendre tout simplement sur le site http://embedresponsively.com/ et d’insérer par simple copier/coller l’adresse URL de votre vidéo youtube ( https://youtube.com/watch?v=xxxxxxxxxxx ).

Appuyez ensuite sur « Embed ».

Le site vous régurgite alors un code à coller dans la version HTML de votre site (pour WordPress cliquez simplement sur la case Texte pour avoir accès à cette version de votre article).

La vidéo Youtube apparaîtra alors aggrandie jusqu’aux bords de votre article, quelle que soit sa dimension et quel que soit le support (smartphone, pc, etc.)

Comment centrer une vidéo sous Youtube

J’utilise souvent Youtube pour insérer des clips / vidéos dans mes articles. Mais j’ai l’impression que depuis le passage au HTML5, quelque chose a changé : je n’arrive plus à centrer ces vidéos Youtube dans mon texte.

Auparavant, dans le code source, j’insérais :

<p style="text-align: center;">...</p>

de part et d’autre du code source de la vidéo, et ça marchait.

Le code tout simple :

Petit conseil perso :

L'IA s'invite partout dans notre quotidien, mais les gros fournisseurs (Claude, Gemini, etc.) imposent de plus en plus de filtres et de censures qui biaisent les réponses. Pour poser des questions vraiment libres sans garde-fous...

J'utilise une plateforme qui rend ces modèles (Claude Opus 4.6, Gemini 3.1 Uncensored, etc.) totalement sans restriction. Ça change la vie pour les recherches approfondies ou créatives.

→ Tester l'IA sans filtre (30% off + 7 jours gratuits)
Lien affilié • Je l'utilise vraiment tous les jours sur Des Geeks et des Lettres • Pas de surcoût pour toi

<center>...</center>

fonctionnait aussi. Mais plus maintenant.

J’ai cherché la solution et j’ai constaté qu’en fait, seule la commande suivante fonctionne pour centrer le code Youtube :

<div align="center">...</div>

Ça peut peut-être vous servir (lancez pas les pierres, je ne suis pas un codeur pro 😀 )

Centrer une vidéo Youtube sous WordPress

EDIT : Le code de Mimie

Code donné par Mimie dans les commentaires ci-dessous, je le reproduis ici parce qu’en effet, après test il fonctionne bien :

<center>...</center> ainsi que <div align="center"> sont devenus des balises/attributs obsolètes de nos jours, même si elles sont plus ou moins bien considérés par les différents navigateurs …

Etant donné que l’insertion d’une vidéo youtube (ou autre d’ailleurs) se fait avec un bout de code ressemblant à cela : <iframe width="575" height="323" src="//www.youtube.com/embed/h_9-3Fj3ZdI?rel=0" frameborder="0" allowfullscreen=""></iframe>, la meilleure solution est pour moi l’ajout du style suivant sur la balise iframe : “margin: 0 auto” (l’attribut width jouant bien son rôle).

Ce qui se traduit donc au final par l’insertion d’un code tel que :

<iframe style="margin: 0 auto" width="575" height="323" src="//www.youtube.com/embed/h_9-3Fj3ZdI?rel=0" frameborder="0" allowfullscreen=""></iframe>

L’IA sans censure ni garde-fous

Claude Opus 4.6, Gemini 3.1 Uncensored, Image Studio…
Je les utilise quotidiennement pour écrire, brainstormer et générer sans filtre.

→ Tester sans limite (30 % off + 7 jours offerts)
Lien affilié • Recommandation personnelle • Soutien le site sans surcoût pour toi
Pour masquer ton IP et contourner les blocages : NordVPN (lien affilié)

13 réflexions au sujet de “Comment centrer une vidéo Youtube dans WordPress”

  1. Bjr Dominique,
    En effet j’ai la même impression que toi, WordPress a dû faire une modif.
    Faudra peut-être que je mette à jour l’article mais les codes peuvent servir à certains.
    Bonne continuation.

  2. Bonjour. Comme l’article date un peu (et même les mises à jour), peut-être que tout à changer mais pour centrer une vidéo, il suffit de récupérer le code (<iframe…) de le coller dans l'article avec texte (dans wordpress) puis une fois retourner dans l'éditeur de mettre le curseur à côté de la vidéo et de cliquer sur le centrage du texte. Je ne parle que des éditeurs classiques, pas de Gounnnteur beurk que je n'aime pas du tout 😉
    Cordialement et merci de ton travail

  3. Je te jette un galet pour la peine !! 🙂

    <center> … </center> ainsi que <div align= »center »> sont devenus des balises/attributs obsolètes de nos jours, même si elles sont plus ou moins bien considérés par les différents navigateurs …

    Etant donné que l’insertion d’une vidéo youtube (ou autre d’ailleurs) se fait avec un bout de code ressemblant à cela : <iframe width="575" height="323" src="//www.youtube.com/embed/h_9-3Fj3ZdI?rel=0" frameborder="0" allowfullscreen=""></iframe>, la meilleure solution est pour moi l’ajout du style suivant sur la balise iframe : « margin: 0 auto » (l’attribut width jouant bien son rôle).

    Ce qui se traduit donc au final par l’insertion d’un code tel que :
    <iframe style="margin: 0 auto" width="575" height="323" src="//www.youtube.com/embed/h_9-3Fj3ZdI?rel=0" frameborder="0" allowfullscreen=""></iframe>

Laisser un commentaire