[the5krunner.com]

I am using this code to wrap around a youtube video
<div class=”embed-responsive embed-responsive-16by9″>https://youtu.be/VjlVGDVuUbM</div&gt;

it shows in preview mode
but when the post is published the youtube video does not show
eg: https://the5krunner.com/2020/06/04/powerdot-review-discount-code/

I am also using this CSS code which you recommended to make the video fit the content properly

.embed-youtube {
position: relative;
display: block;
width: 100%;
padding: 0;
overflow: hidden;
}
.embed-youtube:before {
display: block;
content: “”;
padding-top: 56.25%;
}
.embed-youtube iframe {
position: absolute;
top: 0;
bottom: 0;
left: 0;
width: 100%;
height: 100%;
border: 0;
}

[Theme Horse Support Team]

Hi the5krunner.com,

you should use the embed code of video instead of URL link. You can get option to copy embed code of video by right click the video on youtube.

If you use the block feature of WordPress on post/page editor then you can directly use the youtube video without adding custom CSS code with HTML element wrap.

Thanks

[the5krunner.com]

this still doesn’t work

<div class=”embed-responsive embed-responsive-16by9″>
<i frame width=”1280″ height=”720″ src=”https://www.youtube.com/embed/CszDif6oe2U&#8221; title=”YouTube video player” frameborder=”0″ allow=”accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture” allowfullscreen></i frame>
</div>

in preview mode it displays but with a width that is too wide for the content area
and in published (normal) viewing mode it does not display

[Theme Horse Support Team]

Hi the5krunner.comy,

Your code is slightly wrong with some quote signs also with the embed code has some wrong attribute syntax. please copy the below code and replace with the new fresh embed code. That should definitely work with responsive width.

<div class="embed-responsive embed-responsive-16by9">
 {paste here the Embed Code}
</div>

Thanks

[the5krunner.com]

please check the original post
that is what i did first of all.
it doesn’t work
youtube links display correctly on firefox in preview mode but the screen shows a white space where the video should be once published and live.
Chrome is the same.

div
class=”embed-responsive embed-responsive-16by9″>https://youtu.be/VjlVGDVuUbM
slash div

[the5krunner.com]

eg https://the5krunner.com/2021/06/28/theragun-wave-roller-review/

[Theme Horse Support Team]

the embed code is not working as it should be. Please once check by deactivating the external plugin one by one (if any). some times the external plugin might have affected the Theme. As there is not such issue in our theme. We have checked again and again. Even we are providing the same support and instructions to other clients as well.

Thanks

[Author]

Posts