• Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar

Genesis Snippets

A reference for Genesis theme developers

  • Home
  • Archives
  • Search Genesis Snippets

Modifying the $content_width variable in Genesis

March 21, 2014 By David Wang

WordPress looks for the $content_width variable when determining the width of oEmbed items. To define this variable, you would put this in the functions.php file:

if ( ! isset( $content_width ) )
	$content_width = 600;

However this is kind of limiting especially since we can have multiple layouts in Genesis. So the Genesis team has made it easy to define different $content_widths. For Genesis child themes, we would use this instead:

$content_width = apply_filters( 'content_width', 580, 480, 900 );

The 3 numbers correspond to the content width of the default, small and large layouts. The default layout refers to 2-column layouts; small refers to 3-column layouts and large refers to the full-width content layout.

You can combine this with the following method (borrowed from Twenty Twelve) to apply a different $content_width to different contexts and page templates.

function twentytwelve_content_width() {
	if ( is_page_template( 'page-templates/full-width.php' ) || is_attachment() || ! is_active_sidebar( 'sidebar-1' ) ) {
		global $content_width;
		$content_width = 960;
	}
}
add_action( 'template_redirect', 'twentytwelve_content_width' );

See also: Brad Dalton on How To Change Content Width For Media Embeds Conditionally

Filed Under: Genesis Tagged With: media, oembed, page layouts

Reader Interactions

Comments

  1. Monte says

    May 2, 2014 at 5:22 am

    Hi David, great post!

    I’ve seen this function in child themes, but I never thought about what those three parameters were.

    I’m trying to build a custom layout that displays only the secondary sidebar and content. (using this method from genesistutorials.com). It seems like genesis_content_width called in that filter uses the name of the layout to determine which variable to use. But even though mine is named “secondary-content” it is still returning the $small size.

    Do you have any idea how I could force it to return the $default width?

    • David Wang says

      May 2, 2014 at 9:14 am

      Hi Monte, 2 thoughts:

      1. If it’s a 2-column layout why don’t you just remove_action( 'genesis_sidebar', 'genesis_do_sidebar' ); and add_action( 'genesis_sidebar_alt', 'genesis_do_sidebar' ); for that layout?

      2. Perhaps you could pass the $content_width variable manually for that layout?

  2. Brad Dalton says

    June 1, 2014 at 12:14 am

    Great post David.

    Thanks for the attribution,

Primary Sidebar

Brought to you by ClickWP
Buy the Genesis Theme Framework

Who’s behind this?

Hi! I'm David and I'm a big Genesis fan. I've been using it in all my projects and have found it to be super powerful.

I started this site to keep track of all the snippets that I've been using in my projects and so that it's easy for me to find them again instead of digging through my old project files.

Help support this site by buying Genesis with our affiliate links. Thanks!

Subscribe to Blog via Email

Enter your email address to subscribe to this blog and receive notifications of new posts by email.

Join 173 other subscribers

Browse Snippets

branding cache comments css custom post type doctype entry footer entry header favicon featured image genesis_custom_loop images internet explorer jetpack loop media menu metabox minify navigation oembed page layouts performance plugin integration post thumbnail shortcode sidebars theme options widget areas widgets WooCommerce WordPress
Everything you need to support your online business
Take WordPress further with the Genesis framework

Copyright © 2021 · Genesis Sample On Genesis Framework · WordPress · Log in