Need to change the width on your YouTube Video, native WordPress gallery or tiled gallery using a Mosaic effect?
You can change the content width globally using PHP code but what if you only want to change it on one post or page?
You can also change the width and height for a Youtube embed manually using shortcodes.
What if you only want to change it on all embeds using a specific template or on all galleries assigned to a specific category?
Here’s several tested and working code snippets you can easily modify to your own needs.
Place the code at the end of your child themes functions.php file and change the conditional tag if needed.
The above code will change the width for all embeds including videos and galleries for one specific page.
The above code will change the width for all embeds including videos and galleries for one specific post.
The above code will change the width for all embeds including videos and galleries on multiple posts.
The above code will change the content width for all embeds on multiple posts and pages.
The above code will change the content width for embeds on pages using a specific template.
Difference
Here’s the difference between using the default content width and a custom content width for your tiled gallery. You can clearly see the custom width enables you to display your media full width as opposed to leaving a gap on the side.
Image Gallery Using Full Content Width
Image Gallery Using Partial Content Width
I hope that’s helps point you in the right direction for changing the content width for media embeds.
Related Posts
- Change Tiled Gallery Content Width For Jetpacks Tiled Galleries
- Show Different Size Youtube Videos on Different Pages
How could I oembed Facebook posts properly and make it responsive so it doesn’t stick outside the content box? I attempted the codes above, but it didn’t seem to apply in this case, or more than likely I didn’t do it right. Same if I was to drop Facebook or other oembed code into a widget for responsiveness. Thanks.
The code on this specific page effects all Media embeds and has been tested for use with images and videos.
What may help is using a specific filter like what Jetpack uses http://wpsites.net/web-design/change-tiled-gallery-content-width-for-jetpacks-tiled-galleries/
I would use a Facebook widget rather than hand code it unless it needs to be hard coded into a theme.
You’ll need to write CSS Media Queries for any customization.