Upgrading Artisteer to Version 3 Part 5

WordPress have done a lot of the work for us in version 3.00, and have created a function for selecting the default header,  all we have to do is offer the option to our theme users, so lets add support for the new select default header feature.

In part one we looked at creating a child theme for an existing Artisteer theme, in part two we added the changes in WordPress version 3 for menu functions, in part three  another nice little function is the new backgrounds, WordPress has a lot more header support and applying these changes from the admin panel in part four, now we will extend the header section.

You can download the example Parent theme Here : Example 2.4 Theme (2435)

You can download the example Child theme part 2-5 Here: Artisteer Theme Upgrade Part 2-5 (1158)

If you have been following this series of tutorials you will have your child theme, download the Child Theme part 2-5 file and replace the file  called functions.php, and copy the images folder to your child themes folder as this has the demo headers.

We have moved all the setup functions into a function and we will look at what you need to change for a different theme.

This demo theme download already comes with ten header images and thumbnails, the new headers are the same size as the themes header, and the thumbnails are sized by width to 260px, so we have a full size and thumbnail image for all headers.

We need to tell WordPress where our header.jpg files can be found and give them a name, we have created the folder and have added multiple headers.
In the child themes functions.php we have added a WordPress function call register_default_headers($args), this is now a standard part of WordPress in version 3 and all we have to do is pass an array and WordPress will do the rest. 

In the first line we set the path to the images, with a child theme we cannot use ‘%s’ or  TEMPLATEPATH because that will be the parents folder path, in the array we added a name, a url to the full sized image, and a url to the thumbnail, that is all we need to do, we can add and remove array elements as required, the main work is preparing the header and thumbnail images, for the thumbnail names we have appended ‘-thumbnail’ to the parent image file name. 


$imagepath = get_bloginfo('stylesheet_directory');

// Default custom headers packaged with the theme. with a child theme use get_bloginfo('stylesheet_directory') template directory URI.
 register_default_headers( array(
  'header' => array(
   'url' => $imagepath .'/images/headers/header.jpg',
   'thumbnail_url' => $imagepath .'/images/headers/header-thumbnail.jpg',
   /* translators: header image description */
   'description' => __( 'Default', $childthemename )
  ),
  'autumn' => array(
   'url' => $imagepath .'/images/headers/autumn.jpg',
   'thumbnail_url' => $imagepath .'/images/headers/autumn-thumbnail.jpg',
   /* translators: header image description */
   'description' => __( 'Autumn', $childthemename )
  ),
  'beauty' => array(
   'url' => $imagepath .'/images/headers/beauty.jpg',
   'thumbnail_url' => $imagepath .'/images/headers/beauty-thumbnail.jpg',
   /* translators: header image description */
   'description' => __( 'Beauty', $childthemename )
  ),
  'business' => array(
   'url' => $imagepath .'/images/headers/business.jpg',
   'thumbnail_url' => $imagepath .'/images/headers/business-thumbnail.jpg',
   /* translators: header image description */
   'description' => __( 'Business', $childthemename )
  ),
  'cat' => array(
   'url' => $imagepath .'/images/headers/cat.jpg',
   'thumbnail_url' => $imagepath .'/images/headers/cat-thumbnail.jpg',
   /* translators: header image description */
   'description' => __( 'Cat', $childthemename )
  ),
  'coffee' => array(
   'url' => $imagepath .'/images/headers/inkwell.jpg',
   'thumbnail_url' => $imagepath .'/images/headers/coffee-thumbnail.jpg',
   /* translators: header image description */
   'description' => __( 'Coffee', $childthemename )
  ),
  'cubs' => array(
   'url' => $imagepath .'/images/headers/cubs.jpg',
   'thumbnail_url' => $imagepath .'/images/headers/cubs-thumbnail.jpg',
   /* translators: header image description */
   'description' => __( 'Cubs', $childthemename )
  ),
  'firemen' => array(
   'url' => $imagepath .'/images/headers/firemen.jpg',
   'thumbnail_url' => $imagepath .'/images/headers/firemen-thumbnail.jpg',
   /* translators: header image description */
   'description' => __( 'Firemem', $childthemename )
  ),
  'magic' => array(
   'url' => $imagepath .'/images/headers/magic.jpg',
   'thumbnail_url' => $imagepath .'/images/headers/magic-thumbnail.jpg',
   /* translators: header image description */
   'description' => __( 'Magic', $childthemename )
  ),
  'world' => array(
   'url' => $imagepath .'/images/headers/world.jpg',
   'thumbnail_url' => $imagepath .'/images/headers/world-thumbnail.jpg',
   /* translators: header image description */
   'description' => __( 'World', $childthemename )
  )
 ) );

Visit the admin panel and look at Appearance > Header and we have a new admin section, where we can select one of our header images.

Here we have selected the magic header, and selected update, pretty cool we have a new default header, to make your website friendly, you could have a selection of seasonal images, change the header on specific days or at specific festival times, or seasons.

Now when we load the website the header is updated with our custom header.

Now we can have custom header selections in our Legacy Artisteer theme. 

Credits

New Headers: Created with XHeader (free version available)

Code Samples: Twenty Ten Theme

Notice

Note: we do require your feedback to improve our themes and tutorials, please leave your comments good or bad.

Code disclaimer information
This document contains programming examples therefore, www.DigitalRaindrops.net grants you a nonexclusive copyright license to use all programming code examples from which you can generate similar function tailored to your own specific needs.

All sample code is provided by www.DigitalRaindrops.net for learning illustrative purposes only.

These examples have not been thoroughly tested under all conditions. www.DigitalRaindrops.net, therefore, cannot guarantee or imply reliability, serviceability, or function of these examples.

All programs contained herein are provided to you “AS IS” without any warranties of any kind. The implied warranties of non-infringement, merchantability and fitness for a particular purpose are expressly disclaimed.

Membership

We hope you will benefit from our tutorials Membership to this website is not required, however the downloading of some themes and files is restricted to site supporters.

You can register for a 10 year ‘Free Supporters Account’ from the members page which will give you access to the source files and free themes, as we introduce premium themes and content some of these these will only be downloadable with a subscription, any revenue from subscriptions is used to support the site costs.

This website is a tool to support and promote WordPress and Artisteer, please support, share and give credit for any benefits you gain from the tutorials on this website.

One thought on “Upgrading Artisteer to Version 3 Part 5

Leave a Reply

Connections

Connect with Us
Follow Digital Raindrops on Twitter Join Digital Raindrops on Facebook
Share

Related Posts

Posted in Migration

Child-8-12

To much information and still finding it a bit scary, lets us make it very easy, this quick guide is all the code changes except the styling, there are only three code block to do honest, first we need to find the header.jpg in … Continue reading

Read More