WPMU Tutorials

Nov

Giving your users changeable or custom headers in themes

Posted by Andrea under Themes, how to

Built in to WordPress, and also available for WordPress MU, is the Custom header API. This service allows you to quickly add some code to a theme’s fuinctions.php file to make the header area completely customizable. User will be able to upload a header image of their choice on their chosen theme, without affecting other blogs using the same theme.

You may want to try this first on a test site of WPMU.

First, check and see if your theme has a functions.php file included. If it doesn’t, make a blank file called functions.php. If it already has code in it, which it will if the theme is widget enabled, then you can paste this code in right before the last ?> tag.
//make changeable header
define('HEADER_TEXTCOLOR', ''); define('HEADER_IMAGE', 'setta.jpg'); // %s is theme dir uri and image filename define('HEADER_IMAGE_WIDTH', 985); // make sure these values match the theme header define('HEADER_IMAGE_HEIGHT', 200); define( 'NO_HEADER_TEXT', true );

function atypxmas_admin_header_style() { // change atypxmas to your theme name
?>

// this part adds the header in the admin area
#headimg {
height: <?php echo HEADER_IMAGE_HEIGHT; ?>px;
width: <?php echo HEADER_IMAGE_WIDTH; ?>px;
}

#headimg h1, #headimg #desc {
display: none;}
}

function header_style() {
?>

#header{
background: url(<?php header_image() ?>) no-repeat;}
}

add_custom_image_header(’header_style’, ‘atypxmas_admin_header_style’); // change atypxmas to your theme name you used above.

And that’s it! Everything else is handled internally by WordPress. To make things even easier, here’s a copy of a sample functions.php file. Please read the code and change the values accordingly for your specific theme, including the filename.

5 Responses to “Giving your users changeable or custom headers in themes”

IndieLab Says:
November 7th, 2008 at 10:27 am
Andrea,

Another great post:) I will certainly review this code in the coming months as I get back into theming.
Barry Says:
November 10th, 2008 at 11:40 am
Ha ha - saved me time and effort yet again. Keep up the good work!
IdaWebCo Says:
November 17th, 2008 at 4:42 pm
Everything I ever needed to know about changeable headers in themes. Thank you so much!
Philip M. Hofer (Frumph) Says:
December 1st, 2008 at 12:04 pm
Heya Andrea you missed the if ‘blank’ check so that the words can be hidden when you click hide text, the method you have above won’t allow you to hide text.

I posted the version with the if ‘blank’ statement here:

http://www.lunchboxfunnies.com/forum/viewtopic.php?t=1825

Which will allow you to hide text or show text on both the default and custom header.
Websites tagged "themes" on Postsaver Says:
January 5th, 2009 at 4:02 am
[...] - Eternal Love saved by punkblackstar2008-12-27 - A8stract NTW saved by xfrancois2008-12-23 - Giving your users changeable or custom headers in themes saved by ckeithley2008-12-23 - Wow, Wordpress… saved by SSJ3raditz2008-12-21 - Installation Guide [...]