Header Customization in WordPress 3.0
Users can easily upload their own header backgrounds with this new WordPress 3.0 feature directly from the WordPress administration panel.
“2010″ comes with 8 beautiful header backgrounds (featured below). There is also an option for uploading your own custom headers.
Below is the screenshot of this new WordPress feature followed by a screenshot which is a result of my experimentation.
Header Panel in WordPress 3.0
A Custom Header Made Using the Header Panel in WordPress 3.0
If you want to add this functionality into your theme, then the code snippet below will do the trick. The 2010 WordPress 3.0 theme uses this snippet to enable support for custom header. You will have to use this snippet in functions.php of your WordPress theme to support the custom header functionality. Read the code comments for a walkthrough of what’s going on.
<strong> // Your changeable header business starts here</strong>
define( 'HEADER_TEXTCOLOR', '' );
<strong> // No CSS, just IMG call. The %s is a placeholder for the theme template directory URI.</strong>
define( 'HEADER_IMAGE', '%s/images/headers/path.jpg' );
<strong> // The height and width of your custom header. You can hook into the theme's own filters to change these values.
// Add a filter to twentyten_header_image_width and twentyten_header_image_height to change these values.</strong>
define( 'HEADER_IMAGE_WIDTH', apply_filters( 'twentyten_header_image_width', 940 ) );
define( 'HEADER_IMAGE_HEIGHT', apply_filters( 'twentyten_header_image_height', 198 ) );
<strong> // We'll be using post thumbnails for custom header images on posts and pages.
// We want them to be 940 pixels wide by 198 pixels tall (larger images will be auto-cropped to fit).</strong>
set_post_thumbnail_size( HEADER_IMAGE_WIDTH, HEADER_IMAGE_HEIGHT, true );
<strong> // Don't support text inside the header image.</strong>
define( 'NO_HEADER_TEXT', true );
<strong> // Add a way for the custom header to be styled in the admin panel that controls
// custom headers. See twentyten_admin_header_style(), below.</strong>
add_custom_image_header( '', 'twentyten_admin_header_style' );
<strong> // ... and thus ends the changeable header business.
// Default custom headers packaged with the theme. %s is a placeholder for the theme template directory URI.</strong>
register_default_headers( array (
'berries' => array (
'url' => '%s/images/headers/berries.jpg',
'thumbnail_url' => '%s/images/headers/berries-thumbnail.jpg',
'description' => __( 'Berries', 'twentyten' )
),
'cherryblossom' => array (
'url' => '%s/images/headers/cherryblossoms.jpg',
'thumbnail_url' => '%s/images/headers/cherryblossoms-thumbnail.jpg',
'description' => __( 'Cherry Blossoms', 'twentyten' )
),
'concave' => array (
'url' => '%s/images/headers/concave.jpg',
'thumbnail_url' => '%s/images/headers/concave-thumbnail.jpg',
'description' => __( 'Concave', 'twentyten' )
),
'fern' => array (
'url' => '%s/images/headers/fern.jpg',
'thumbnail_url' => '%s/images/headers/fern-thumbnail.jpg',
'description' => __( 'Fern', 'twentyten' )
),
'forestfloor' => array (
'url' => '%s/images/headers/forestfloor.jpg',
'thumbnail_url' => '%s/images/headers/forestfloor-thumbnail.jpg',
'description' => __( 'Forest Floor', 'twentyten' )
),
'inkwell' => array (
'url' => '%s/images/headers/inkwell.jpg',
'thumbnail_url' => '%s/images/headers/inkwell-thumbnail.jpg',
'description' => __( 'Inkwell', 'twentyten' )
),
'path' => array (
'url' => '%s/images/headers/path.jpg',
'thumbnail_url' => '%s/images/headers/path-thumbnail.jpg',
'description' => __( 'Path', 'twentyten' )
),
'sunset' => array (
'url' => '%s/images/headers/sunset.jpg',
'thumbnail_url' => '%s/images/headers/sunset-thumbnail.jpg',
'description' => __( 'Sunset', 'twentyten' )
)
) );
WordPress 3.0 Background Customization
The 2010 WordPress 3.0 theme also permits users to change the background of posts and pages from the backend administration panel.
There are a lot of options such as the ability to choose different colors and uploading an image to set as your background.
Custom Background Panel
Adding custom background functionality in your own theme is pretty simple. Just add this one line of code in your theme’s functions.php file.
add_custom_background();
After that, users who have activated your theme will get a Background tab under the Appearance tab.
New Link Shortener
WordPress 3.0 offers better micro-blogging (e.g. Twitter) integration with its new feature called Shortlink, which gives you the ability to generate branded short links (in a similar way as is.gd or bit.ly) for sharing your posts and pages in social media.
WordPress 3.0′s Easy Navigation Menu Management
The exciting menu management feature is one of the most anticipated and demanded features of WordPress end-users.
This new feature will make it easy as pie for users to add new navigation menus in their WordPress-powered blogs and websites.
You will need no coding experience to modify your WordPress navigation: Just drag and drop menu items, and that’s it.
You can add outgoing links, categories and pages in one single menu just by using the navigation menu’s management feature. This is an insanely awesome and powerful feature to make WordPress site management all the more easier for WordPress users.
See how I made the navigation menu below.
Menus Panel (Features Drag and Drop)
WordPress 3.0 Features