Different Header Image

Yes, you can bug me here.

If you want specific header images for specific pages you need to write a function for it. Essentially you create a function that detects the pages using conditional tags and inject that function into the header.php template file replacing the code that is currently adding the header image.

Done. Yahoo! Thanks

@ dtjin

Hey would you mind to share the snippet?

I’m trying to achieve the same result and possibly more ??

Thaaaanks

At work. Will get back to you… it’s a little broken though… because if I go to my customize tool the code stop workings…

I thought you could go to my site to look at my customizer.php file for the code but our friend Alferdo said you can’t look at php files online..

It just occurred to me that I can actually just log into my wp site and grab the code there lol…

Here.. I got my other teacher to help me.. but it’s not working 100 percent…

function AC_custom_header_setup() {

	add_theme_support( 'custom-header', apply_filters( 'AC_custom_header_args', array(

		'default-image'          => custom_dewi_header(),
		'default-text-color'     => 'ffffff',
		'width'                  => 1280,
                'flex-width'             => true,
		'height'                 => 300,
		'flex-height'            => true,
		'wp-head-callback'       => 'AC_header_style',
		'admin-head-callback'    => 'AC_admin_header_style',
		'admin-preview-callback' => 'AC_admin_header_image',
	) ) );
}
add_action( 'after_setup_theme', 'AC_custom_header_setup' );

function custom_dewi_header() {

//if this is a home page use header image

   if ( $_SERVER['REQUEST_URI'] === "/" ) {
     return get_template_directory_uri() . '/images/header.jpg';

    //if this is the cooking-lessons-learnt-making-mistakes page do this
  } else if ($_SERVER['REQUEST_URI'] === "/cooking-lessons-learnt-making-mistakes-101/") {
 	return get_bloginfo('url')."/wp-content/themes/ArtisticCollaboration/images/headers/mini_burgers.jpg";

  } else if ($_SERVER['REQUEST_URI'] === "/food-slash-cooking-philosophies/") {
     return get_bloginfo('url')."/wp-content/themes/ArtisticCollaboration/images/headers/bacon_wrapped_chicken.jpg";

  } else if ($_SERVER['REQUEST_URI'] === "/explanations/") {

      return get_bloginfo('url')."/wp-content/themes/ArtisticCollaboration/images/headers/eggs_and_dill.jpg";

  } else if ($_SERVER['REQUEST_URI'] === "/about/page-with-comments-disabled/") {

      return get_bloginfo('url')."/wp-content/themes/ArtisticCollaboration/images/header.jpg";

  } else if ($_SERVER['REQUEST_URI'] === "/you/") {

      return get_bloginfo('url')."/wp-content/themes/ArtisticCollaboration/images/header.jpg";

  }

}

I have this on the top of my custom-header.php but it’s not working properly because if I click on the customizer tool on my site the code stops working.. I haven’t add time to fix it..

@ dtjin

Thanks so much for this. Even if does not work 100% it is an excellent starting point to work out an optimal solution.

Let’s see if I can come out with some small improvement to your code…

@dtjin @mor10 @scott

I’m not even close to a solution but I’m gathering different input to implement your code that has the limitation to be hardcoded when it comes to images url and posts/pages names and links.

Scott suggested to use GET the ID for the posts.
Morten suggested to publish the pictures in posts and than to get the post id for th picture as well.

This would make your snippet more “dynamic” so you won’t be bound to those page/file names or urls.

Let’s see how it goes…

@dtjin

working on a rough solution like this:

function header_image_switcher(){

	switch(true) {
		case(is_home()) :
			$get_header_image = 'en.jpg';
		break;

		case(is_archive()) :
			while(have_posts()) {
				the_post();
	            $get_header_image = 'it.jpg';
			}
		break;

		case(is_single()) :
			while(have_posts()) {
				the_post();
	            $get_header_image = 'de.jpg';
			}
		break;

		default:
			$get_header_textcolor;
		break;
	}
}

it is not working because I’m still working on it, it is just an idea eh!

I switched this topic back to unresolved because it’s not done yet… lol.. Morten was going to tell us something about linking our images to the pages after the meet-up.. maybe he will see this and reply…

Is switch and case actually codes or are you just trying to tell me what you are trying to do..?

Let me pitch in here with some crazy ideas:

1. How about using the Featured Image function to control the header image on specific pages? Create a new image size that matches the header image, then add the images you want as featured images, and create a conditional that displays the featured image in the header on selected pages much like what Giorgio has.

2. Or, use a custom field to collect the custom header image.

3. Or, make a custom meta box with an image uploader for the custom header image.