When oEmbed fails, display an alternative

I want to specify an alternative image that will be displayed when oEmbed fails.

The specific use case is to offer an alternative when China (or other countries) block YouTube. We know the YouTube content won’t be available there, but want to provide an alternate image in that case.

Can the oEmbed error code be made accessible for this purpose?

2 s
2

I think the best thing to do in this case is to wrap your oEmbed content with a div before they are rendered and then show an alternate image with the CSS background-image property. If the video loads, then the oEmbed content will cover the background image.

You can add the wrapper using the embed_oembed_html filter.

add_filter('embed_oembed_html', 'your_function_here');

If you’re worried about loading in extra elements, then you can do a client side check with JS to see if the oEmbed loaded, and if not, load a background image into the wrapper.

You could get a lot more complicated by adding in custom fields for each video, but that’s essentially the gist of it.

Leave a Comment