WordPress.org

Forums

Simone
Different Header Image (11 posts)

  1. dtjin
    Member
    Posted 9 months ago #

    HEY!

    I can bug you here....

    What do I do to change the header images so that I can upload different ones on different pages? Right now I have that one strawberry picture.... but I want to have different header images for different pages...

    D

  2. Morten Rand-Hendriksen
    Inactive
    Theme Author

    Posted 9 months ago #

    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.

  3. dtjin
    Member
    Posted 8 months ago #

    Done. Yahoo! Thanks

  4. Giorgio25b
    Member
    Posted 8 months ago #

    @ dtjin

    Hey would you mind to share the snippet?

    I'm trying to achieve the same result and possibly more ;-)

    Thaaaanks

  5. dtjin
    Member
    Posted 8 months ago #

    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..

  6. dtjin
    Member
    Posted 8 months ago #

    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..

  7. Giorgio25b
    Member
    Posted 8 months ago #

    @ 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...

  8. Giorgio25b
    Member
    Posted 8 months ago #

    @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...

  9. Giorgio25b
    Member
    Posted 8 months ago #

    @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!

  10. dtjin
    Member
    Posted 8 months ago #

    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..?

  11. Morten Rand-Hendriksen
    Inactive
    Theme Author

    Posted 7 months ago #

    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.

Reply

You must log in to post.

About this Theme

About this Topic