Lorsque comme nous vous possédez un site utilisant le CMS WordPress, il est possible que vos vidéos ne s’affichent pas correctement sur vos smartphones. Ceci est d’autant plus embêtant surtout si vous utilisez un template Responsive.
Sur de nombreux sites, il est conseillé d’effectuer une modification du css ce qui peut être délicat et complexe selon votre niveau. Sachez que cette solution ne fonctionne pas sur notre blog.
.video-container {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px;
height: 0;
overflow: hidden;
}
.video-container iframe,
.video-container object,
.video-container embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.entry-content img,
.entry-content iframe,
.entry-content object,
.entry-content embed {
max-width: 100%;
}
Au final, il nous suffit juste d’utiliser une class CSS propre à WordPress qui est déjà prévu pour ce cas de figure comme ci-dessus et glisser dedans notre lien Youtube.
<div class="embed-container">
https://www.youtube.com/watch?v=B43lA0axO64
<div>
Vos vidéos ne déborderont plus de leurs conteneurs dès à présent.
Rédaction par Smoothie
Relecture et correction par Benismooth