Every now and then you find an interesting support question in the WordPress forums. A member wanted to take the HTML YouTube oEmbed code and modify it to suit his needs.
It was an easy set of requirements.
- Replace ?feature=oembed with ?wmode=transparent
- Append add wmode=”Opaque” to the end of the start iframe tag
My solution was to find all of the embeded YouTube <iframe…> tags in the post and modify the_content via a filter with some preg_match_all
code.
You can see the code I came up with via this pastebin.com link.
It’s a nice enough solution and really highlights the point I was trying to make:
You do not have to hack existing code in WordPress to get the results you want.
Just use the available WordPress filters to modify the output as you need.
Jan? You do know you got that completely wrong right?
Yes. Yes I do. Well maybe not completely wrong but the code I posted was not the best solution.
I filtered the content because I’m used to playing in that space and it’s so easy to do. But my solution did not work for the person asking because what he was referring to did not output via the_content. He had to add another filter to make it work.
The original question was about how to modify oEmbed output. That’s a completely different filter and using the right one gets you a targeted solution that will work (should work anyways) at any place the oEmbed output is used.
Last year Mika Epstein posted a plugin called Rickroll that does exactly what it sounds like. It takes oEmbed video and replaces it with the Rickroll video.
You can learn a lot looking at other people’s code. It also has exactly what I needed to examine and make the modification to the YouTube oEmbed html.
Here’s the new code in a plugin.
add_filter('embed_oembed_html','mh_adjustyoutube',10,3); function mh_adjustyoutube( $html, $url, $args ) { if ( strstr($url, 'youtube.com') ) { // Replace ?feature=oembed $mh_new = str_replace( "?feature=oembed" , "?wmode=transparent" , $html ); // Append wmode="Opaque" $mh_new = preg_replace( '/></iframe>$/' , ' wmode="Opaque">' , $mh_new ); $html = $mh_new; } // Modified or not return $html return $html; }
This has fewer lines, simpler logic, and it is a solution that specifically filters the oEmbed output. It directly addresses the original question and can be used where ever the oEmbed code gets outputted.
You can see an easier to read version via this new pastebin.com link.
The lesson I learned is this: using WordPress filters is a powerful feature but using them correctly is even better.
Comments by Jan Dembowski
New Life for old 3D Printers
I'm a little late in replying but that print surface? ...
This is not a Gutenberg Review, It’s a Blog Post
Oh, as someone who supports WordPress users in the forums ...
This is not a Gutenberg Review, It’s a Blog Post
That's fantastic. ;) The Classic Editor and at least one ...
This is not a Gutenberg Review, It’s a Blog Post
The blockquote tag works in the HTML comments here if ...
This is not a Gutenberg Review, It’s a Blog Post
It's not about popular belief. And WordPress is 100% open-source ...