apply_filters( ’embed_oembed_html’, string|false $cache, string $url, array $attr, int $post_id )

User Contributed Notes

1. Skip to note 5 content

   Matt Radford 8 years ago

   You must log in to vote on the helpfulness of this noteVote results for this note: 2You must log in to vote on the helpfulness of this note

   Wrap oEmbed in a div. Useful for making video responsive, for example.

   add_filter( 'embed_oembed_html', 'wrap_oembed_html', 99, 4 );
   
   function wrap_oembed_html( $cached_html, $url, $attr, $post_id ) {
   	if ( false !== strpos( $url, "://youtube.com") || false !== strpos( $url, "://youtu.be" ) ) {
   		$cached_html = '<div class="responsive-video">' . $cached_html . '</div>';
   	}
   	return $cached_html;
   }
2. Skip to note 6 content

   swis 8 years ago

   You must log in to vote on the helpfulness of this noteVote results for this note: 2You must log in to vote on the helpfulness of this note

   Note that https://developer.wordpress.org/reference/hooks/embed_oembed_html/#comment-1964 very incorrectly assumes that every oEmbed response contains a video, and even more incorrect raises the expectation that every oEmbed response has the same aspect-ratio.

   Please never copy/paste the example as-is into your theme. Especially not when the theme is intended to be re-used/sold. It is killing oEmbed.

   • Only want to filter YouTube and Vimeo? User this instead:

      add_filter( 'embed_oembed_html', 'wpse_embed_oembed_html', 99, 4 );  function wpse_embed_oembed_html( $cache, $url, $attr, $post_ID ) { 	$classes = array(); 	 	// Add these classes to all embeds. 	$classes_all = array( 		'responsive-container', 	); 	 	// Check for different providers and add appropriate classes. 	if ( false !== strpos( $url, 'vimeo.com' ) ) { 		$classes[] = 'vimeo'; 	} 	 	if ( false !== strpos( $url, 'youtube.com' ) ) { 		$classes[] = 'youtube'; 	} 	 	$classes = array_merge( $classes, $classes_all ); 	 	return '' . $cache . ''; } 

     Props to Dave Romsey on StackExchange.

     Matt Radford 7 years ago
3. Skip to note 7 content

   Ryan Burnette 8 years ago

   You must log in to vote on the helpfulness of this noteVote results for this note: 0You must log in to vote on the helpfulness of this note

   I wish I had known before I implemented code on this hook that JetPack overrides and doesn’t reimplement the filter. If you hook anything to this be sure you won’t be using JetPack or it won’t work. https://github.com/Automattic/jetpack/issues/1571

   • Use this filter if Jetpack is activated.add_filter('video_embed_html', 'wrap_embed_html'); // Jetpack

     Matt Radford 7 years ago
4. Skip to note 8 content

   Maya Soloveva 6 years ago

   You must log in to vote on the helpfulness of this noteVote results for this note: 0You must log in to vote on the helpfulness of this note

   To wrap oEmbed in a div it’s better to use oembed_dataparse filter, cause it allows to get parameters of oEmbed, such as type, width and height.