Embedded YouTube Videos not display in published posts

[stinson808]

I run an English learning blog for ESL students. I noticed that my embedded YouTube videos were showing fine in the blocks editor, but not on the published page.

My blog is here: https://worldenglishblog.com/blog

I switched back to the default theme to include videos so as not to lose trust with my audience. I often name posts “with video” for people to hear natural English as part of the lesson.

Today I switched back to X-theme with a workaround on my most popular posts with a thumbnail image that links directly to YouTube, but this is not optimal.

Here is the feedback I got from WordPress

I’ll paste that CSS that I am seeing here as well so it is easier to see.

.x-resp-embed iframe, .is-type-video iframe {
** display: block !important;**
** position: absolute !important;**
** top: 0 !important;**
** left: 0 !important;**
** width: 100%;**
** height: 100%;**
** margin: 0 !important;**
}

I found a similar thread here but it did not solve my issue.

Embedded Youtube videos not displaying on front-end

Hi @Glasseye, Please turn off this Media setting. [image] That seems to be not a native feature of Gutenberg and causing the issue. Thanks,

I don’t have a media settings option.

Any help is appreciated in advance.

Thanks,

Dave

[tristup]

Hi Dave,
Thanks for reaching out.

We need to examine your site to check what exactly happening at your end. Please provide login credentials for your site in a secure note to examine it further, including:

– WordPress Site URL & Admin URL
– Specific Page URL, where you are having the issue.
– WordPress Admin username/password

To create a secure note, click the key icon underneath any of your posts.

Thanks

[stinson808]

I see what you mean by POSTS now! Sorry, my bad.

[nabeel]

Hey Dave,

I checked your site this could be happening because you’ve updated the Cornerstone to the latest version but haven’t updated X to the newer version. To avoid the incompatibility issues and potential errors, always make sure to update both X and Cornerstone to the latest versions.

You can find the latest version numbers here: (http://theme.co/changelog/) Then you can compare them to what’s installed on your site. If you find anything to be out of date, you can review our update guide.

After doing the updates, always remember to clear all caches (if you are using WP Rocket, WP SuperCache or W3 Total Cache) when updating so that the code from the latest release is always in use. This will help you to avoid any potential errors.

If the issue persists then try testing for third party plugin conflicts (please follow https://theme.co/docs/common-issues#testing-for-plugin-conflict)

If you still have problems then please get back to us with the URL/User/Pass of your WordPress dashboard using the Secure Note functionality of the post to follow up the case.

Thanks!

[stinson808]

Thanks Nabeel,

I did update X and cleared my cache but no change to my video issue.

I just made a secure note as per Tristup’s suggestion.

Thanks again for your attention.

Dave

[tristup]

Hi Dave,

After going through the exact page URL where the issue is, it has been found the position attribute of the class wp-block-embed__wrapper is the actual reason behind the issue.

You can get rid of this by adding a small piece of custom CSS code to Theme Option > CSS.

.wp-block-embed__wrapper
{
    position: initial !important;
}

The above code will work if copied as it is and doesn’t conflict with any existing code.
Please note that the code provided serves only as a guide to help you get started custom coding on your own if there’s no option offered in our theme or the products we bundle.
We do not provide support for custom codes that means we can’t fix it in case it conflicts with something in your site nor will we enhance it.

If that does not help, please provide the password once again as the given Password is not working.

Thanks

[stinson808]

That did the trick.

Thanks very much for your help Tristup, much appreciated.

Dave

[ruenel]

You’re welcome!
We’re glad we were able to help you out.