yanknudtskov
11/23/2014 - 10:05 AM

WordPress, Bootstrap 3 Render a responsive media embed

WordPress, Bootstrap 3

Render a responsive media embed

<?php

function get_embed_video_html($url) {
    $embed_link = '[embed]'.$url.'[/embed]';
    $embed_link = apply_filters('the_content', $embed_link);

    $output = '';
    $output .= '<div class="responsive-video">';
    $output .= $embed_link;
    $output .= '</div>';

    return $output;
}

echo get_embed_video_html($url_to_video);

?>

.responsive-video {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 60px; overflow: hidden;
}

.responsive-video iframe,
.responsive-video object,
.responsive-video embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}