• Passer au contenu principal
  • Passer à la barre latérale principale
  • Passer au pied de page
  • Être anonyme sur internet
  • Être anonyme sur Paypal
  • Mon téléphone est-il espionné ?
Logo Des Geeks Et Des Lettres

Des Geeks et des lettres

L'impact des technologies numériques sur l'individu

Tapez vos requêtes

Comment centrer une vidéo Youtube dans WordPress

Rédigé par Mallory Lebel le 23 décembre 2013

Centrer une vidéo Youtube sous Wordpress

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 :

<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>

Sending
Quelle note attribuez-vous sur un total de 5 ?
4.8 (5 votes)

Mes autres entrées sur le sujet: Web

NordVPN : Digne de confiance

Actuellement, NordVPN est l'un des fournisseurs de services VPN premium les plus sûrs.


Confidentiel

  • Son emplacement commercial
  • Sa politique d'absence de logs
  • Son infrastructure

...garantissent que la confidentialité de vos données sera respectée.

Il a fait l'objet de deux audits publics et détient la certification ioXt.

EN SAVOIR PLUS


découvrez NordVPN en 1 clic

Evolution

En juillet 2019, NordVPN a sorti son opus magnum : le protocole NordLynx.

Construit autour du protocole de tunneling WireGuard, il est capable d'offrir encore plus de fiabilité (grâce au système de double NAT) et des vitesses plus rapides.


Utilisez notre moteur de recherche

Qui suis-je ?

DES GEEKS ET DES LETTRES aide les gens à protéger leur liberté en leur fournissant des conseils, des guides et un soutien qui aident les citoyens à protéger leurs communications, leurs actions et leurs discussions numériques. Cela inclut des conseils sur le chiffrement du courrier électronique, la cybersécurité et le cryptage des données.

Notre ambition ? Que les gens aient la liberté de vivre leur vie sans craindre d'être surveillés. Les tendances technologiques sont en constante évolution, et la cybersécurité ne fait pas exception à la règle. Rester informé est un élément crucial pour une utilisation sûre d'internet. Les lecteurs peuvent découvrir ici des sujets importants liés à la sécurité du web, se plonger dans les meilleurs produits de sécurité et mettre en pratique ce qu'ils ont appris.

13 Comments

  1. Dominique 7 avril 2020

    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

    Répondre
    • Mallory Lebel 7 avril 2020

      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. Anonyme 24 mars 2018

    Merci beaucoup, c’est exactement ce que je cherchais 🙂

    Répondre
    • Greg 25 mars 2018

      Merci de ta participation en tout cas !

  3. Greg 2 mars 2018

    Mise à jour de l’article avec une autre astuce.

    Répondre
  4. Canima 30 octobre 2014

    Super, avec … ça fonctionne, merci pour cette astuce !

    J’ai enfin pu centrer mes vidéos 🙂
    http://canima.net/videos-canima/

    Répondre
    • Greg 30 octobre 2014

      😀

  5. Pierre de nonconventionalsourcesofenergy 4 mai 2014

    oui sauf que ça ne marche pas!

    Répondre
    • Greg 7 mai 2014

      T’as essayé de mettre WordPress à jour ? Chez moi ça fonctionne. (mettre à jour le HTML 5 aussi)

  6. giga34Y 27 décembre 2013

    merci pour greg et mimi pour les codes ,maintenant ,on a plus de choix pour insérer nos vidéos!

    Répondre
  7. Mimie 23 décembre 2013

    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>

    Répondre
    • Greg 23 décembre 2013

      Hop ! je choppe ton galet et je testerai ton code, peut me rendre 🙂

    • Greg 24 décembre 2013

      Ok, ton code marche impec, je le rajoute dans l’article. Thx !

Répondre à Canima Annuler la réponse

Barre latérale principale

Ne ratez pas un article
Nom : 
Email :*
Please wait...
Please enter all required fields Click to hide
Correct invalid entries Click to hide
Aucun spam. Recevez nos articles par Email

A lire aussi

gibiru moteur de recherche anonyme

Quel moteur de recherche sans censure ?

Publié le 7 mars 2022

expressvpn

Critique d’ExpressVPN : Une option populaire mais coûteuse

Publié le 7 mars 2022

Pages utiles

  • Les auteurs du blog
  • A propos
  • Blog
  • Mentions légales
  • Plan du site
  • Contactez-nous
nordvpn-banniere-perso-350

Footer

À propos

Vous êtes surveillé. De multiples organisations privées et publiques surveillent et enregistrent vos activités en ligne.

DesGeeksetdeslettres.com fournit des outils et des connaissances pour protéger votre vie privée contre la surveillance massive mondiale. Ce blog anime depuis 2009 une communauté florissante d'individus soucieux de la protection de la vie privée et s'informe au jour le jour des nouvelles avancées en matière de protection de vos données en ligne.

Notre but : rechercher et recommander les meilleures solutions logicielles pour notre communauté.

→ The Pirate Bays : solutions et sites miroir pour y accéder

La transparence

La transparence est notre plus grande valeur et c’est ce qui nous distingue du reste de la communauté. Les modifications rédactionnelles apportées à ce blog et aux produits que nous recommandons sont toujours discutées dans la section des commentaires, grâce au formulaire de contact ou encore via nos réseaux sociaux comme Facebook ou Twitter.

Ce blog tient à remercier les centaines de lecteurs, contributeurs et vérificateurs de faits qui s’assurent que nos recommandations sont solides et fiables.

De même, nous ne pourrions rien faire sans nos entreprises affiliées ainsi que les membres de la communauté qui aident à partager nos nouvelles et à faire passer le mot. Je vous remercie du fond du coeur!

Recherche

Articles les plus populaires

  • Kickasstorrent : Connexion et téléchargement
  • RARBG Torrent : Proxy, Miroirs et Alternatives
  • 10 méthodes comment pirater un compte Netflix
  • Où trouver les meilleurs torrents de musique ?
  • Accéder à French Stream malgré la censure
  • Comment regarder Retour à l’Instinct Primaire non censuré

© DES GEEKS ET DES LETTRES blog français depuis 2009 Facebook Twitter Pinterest Newsletter

Desgeeksetdeslettres.com est un site web à vocation populaire qui fournit des informations pour protéger la sécurité et la confidentialité de vos données.

Ne confiez jamais votre vie privée à une entreprise, chiffrez toujours vos données.