Last active
January 30, 2017 19:57
-
-
Save AustinGil/a3f0a156ce99d8b2144622a222494a66 to your computer and use it in GitHub Desktop.
A shortcode to add oEmbeds that are fluid and 16:9 aspect ratio
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
.fluid-oembed { | |
position: relative; | |
padding-bottom: 56.25%; | |
padding-top: 30px; | |
height: 0; | |
overflow: hidden; | |
} | |
.fluid-oembed iframe, | |
.fluid-oembed object, | |
.fluid-oembed embed { | |
position: absolute; | |
top: 0; | |
left: 0; | |
width: 100%; | |
height: 100%; | |
} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Add Shortcode | |
function fluid_oembed_shortcode( $atts ) { | |
// Attributes | |
extract(shortcode_atts( | |
array( | |
'url' => '', | |
), | |
$atts | |
)); | |
echo '<div class="fluid-oembed">' . wp_oembed_get($url) . '</div>'; | |
} | |
add_shortcode( 'fluid_oembed', 'fluid_oembed_shortcode' ); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment