How to Use a Full Width Header with FoxyNews

Using a full width header with FoxyNews requires a few small modifications. The sample code below assumes the image is sized at 950 x 170px

Thesis Users

Using the Thesis custom file editor add this to your custom_functions.php:

define( 'HEADER_IMAGE_WIDTH', apply_filters( 'foxynews_header_image_width', 950 ) );
define( 'HEADER_IMAGE_HEIGHT', apply_filters( 'foxynews_header_image_height', 170 ) );

This code will change the default size for headers in the WordPress header uploader.

Now in custom.css add the following:

.custom #header_area #header {
    width: 950px;
}

.header-image #header_area #header #logo a {
	width: 950px;
}

.custom #header_area .page {
	height: 230px;
}

That’s it, now go to Appearance -> Header and upload your new header image.

Note: if you use FTP to edit the files directly remember it’s the custom.css and custom_functions.php file inside the FoxyNews folder not the one directly in the Thesis folder

Genesis Users

First go to your FoxyNews options screen and make sure this option is checked: “Include the custom.css stylesheet?”

Now go into the wp-content/themes/foxynews/custom/custom_functions.php file and add this:

define( 'HEADER_IMAGE_WIDTH', apply_filters( 'foxynews_header_image_width', 950 ) );
define( 'HEADER_IMAGE_HEIGHT', apply_filters( 'foxynews_header_image_height', 170 ) );

This code will change the default size for headers in the WordPress header uploader.

Next open up the custom.css file in the same folder and add the this CSS:

.header-image #title-area, .header-image #title, .header-image #title a {
	height: 200px;
}

#header .wrap {
	height: 230px;
}

That’s it, now go to Appearance -> Header and upload your new header image.