When oEmbed fails, display an alternative

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