I want to make videos responsive...

There is a function in /wp-includes/media.php file: line 2497:

$html_atts = array(
    'class'    => apply_filters( 'wp_video_shortcode_class', 'wp-video-shortcode' ),
    'id'       => sprintf( 'video-%d-%d', $post_id, $instance ),
    'width'    => absint( $atts['width'] ),
    'height'   => absint( $atts['height'] ),
    'poster'   => esc_url( $atts['poster'] ),
    'loop'     => wp_validate_boolean( $atts['loop'] ),
    'autoplay' => wp_validate_boolean( $atts['autoplay'] ),
    'preload'  => $atts['preload'],

Not sure how to add this in my functions.php?

What I want to add is a hook (I guess) with this:

<div class="embed-responsive embed-responsive-16by9">
  <iframe class="embed-responsive-item" src="…"></iframe>

html that I have on the page at the moment is:

<iframe width="600" height="400" frameborder="0" allowfullscreen="allowfullscreen" src="...">

I want to add or replace these with bootstrap ones.

How can I do it?



This is how I bootstrapped youtube embeds in one of my projects.

 * Responsive Youtube embeds.
add_filter( 'embed_oembed_html', function( $html, $url, $attr, $post_ID ) {
  if ( false !== stripos( $html, '<iframe ' ) && false !== stripos( $html, '.youtube.com/embed' ) ) {
    $html = sprintf('<div class="embed-responsive embed-responsive-16by9">%s</div>', $html );

  return $html;
}, 10, 4);

Please note this snippet is using anonymous functions which are available in > PHP 5.3

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.