WordPress.org

Support

Support » Themes and Templates » Twenty Twelve » [Resolved] Setting default header image in child theme

[Resolved] Setting default header image in child theme

  • Twenty Twelve by default doesn’t have a header image specified. For a child theme, I need to set a default header image. I’ve tried overriding the custom header functionality, but wasn’t able to find a durable solution.

    I tried copying the /inc/custom-header.php to the child theme’s folder, and customize it there, but the child theme just kept using the parent theme’s custom-header file.

    My current solution is to replace line 83 of the parents functions.php
    require( get_template_directory() . '/inc/custom-header.php' );
    with
    require( get_stylesheet_directory() . '/inc/custom-header.php' );
    This does the trick, however, I will need to make the change everytime Twenty Twelve gets updated.

    Anyone has a solution that can withstand an update to the parent theme?

Viewing 15 replies - 1 through 15 (of 31 total)
  • I have the same exact problem. I hope someone can help you out.

    Moderator Andrew Nevins

    @anevins

    Forum moderator

    Double the chance of resolving the problem by creating your own thread.

    Thanks Andrew.

    paulwpxp

    @paulwp

    Font hero

    add this in your child theme’s function.php

    remove_action( 'after_setup_theme', 'twentytwelve_custom_header_setup' );

    go to here
    http://core.trac.wordpress.org/browser/tags/3.5/wp-content/themes/twentytwelve/inc/custom-header.php

    and copy from #L21 to #L47 (including line #21 and including line #47)

    then in your child’s function.php paste the code into it right below that first line you just added.

    then change the name of the function twentytwelve_custom_header_setup ( there are 2 instances ) to your own, like mytheme_custom_header_setup

    then look inside that function you will notice the 'default-image' in $args is currently empty, just specify one you want.

    Done.

    It looks complicated but it’s not, and it could be easier if there were a filter hook to change the $args

    /**code to allow custom image in child theme*/
    
    remove_action( 'after_setup_theme', 'crossfitcrossfire_custom_header_setup' );
    
    function crossfitcrossfire_custom_header_setup() {
    22	        $args = array(
    23	                // Text color and image (empty to use none).
    24	                'default-text-color'     => '444',
    25	                'default-image'          => '',
    26
    27	                // Set height and width, with a maximum value for the width.
    28	                'height'                 => 250,
    29	                'width'                  => 960,
    30	                'max-width'              => 2000,
    31
    32	                // Support flexible height and width.
    33	                'flex-height'            => true,
    34	                'flex-width'             => true,
    35
    36	                // Random image rotation off by default.
    37	                'random-default'         => false,
    38
    39	                // Callbacks for styling the header and the admin preview.
    40	                'wp-head-callback'       => 'twentytwelve_header_style',
    41	                'admin-head-callback'    => 'twentytwelve_admin_header_style',
    42	                'admin-preview-callback' => 'twentytwelve_admin_header_image',
    43	        );
    44
    45	        add_theme_support( 'custom-header', $args );
    46	}
    47	add_action( 'after_setup_theme', 'twentytwelve_custom_header_setup' );
    /*end custom header image code-----------------------*/

    This is what I added. How do I specify and different image? ($args)

    Thanks and sorry.I’m not a coder.

    paulwpxp

    @paulwp

    Font hero

    Copy and paste this to your child theme’s function.php

    /**
     * add this to TwentyTwelve's Child theme's function.php
     * to define default header image which TwentyTwelve doesn't have
     */
    
    // remove default action from Twenty Twelve
    remove_action( 'after_setup_theme', 'twentytwelve_custom_header_setup' );
    
    // define new $args ,basically it's the same function copied over but with added default-image
    function mytheme_custom_header_setup() {
    	$args = array(
    		// Text color and image (empty to use none).
    		'default-text-color'     => '444',
    		'default-image'          => get_stylesheet_directory_uri() . '/images/mythemeheader.jpg',
    
    		// Set height and width, with a maximum value for the width.
    		'height'                 => 250,
    		'width'                  => 960,
    		'max-width'              => 2000,
    
    		// Support flexible height and width.
    		'flex-height'            => true,
    		'flex-width'             => true,
    
    		// Random image rotation off by default.
    		'random-default'         => false,
    
    		// Callbacks for styling the header and the admin preview.
    		'wp-head-callback'       => 'twentytwelve_header_style',
    		'admin-head-callback'    => 'twentytwelve_admin_header_style',
    		'admin-preview-callback' => 'twentytwelve_admin_header_image',
    	);
    
    	add_theme_support( 'custom-header', $args );
    }
    
    // add it the same way Twenty Twelve does
    add_action( 'after_setup_theme', 'mytheme_custom_header_setup' );

    This code is tested, it works.

    If not, under Appearance > Header click ‘Restore Original Header Image’

    and also, make sure in your child theme there is a folder images with mythemeheader.jpg in it, or whatever you name it just make sure it matches the file name in the code.

    Thanks.I’ll try it and get back to you.

    make sure in your child theme there is a folder images with mythemeheader.jpg

    That can also be .png, correct?

    paulwpxp

    @paulwp

    Font hero

    Correct, as long as the actual file’s name matches in this line of code from above.

    'default-image' => get_stylesheet_directory_uri() . '/images/mythemeheader.jpg',

    The mythemeheader.jpg is just a placeholder name, could be whatever. Also, the folder images is not really necessary, it just a way to organize files.

    We do have some more to do here, but you are “da man”, paulwp!

    Welcome to NoNameYet A.A. Chat!

    Many thanks!

    What I hope to eventually do there is to use that as a background and to place my other items already there and a smaller header image over it.

    How are you coming along there, fernandopolania?

    Thanks a lot Paul, that did exactly what I needed.

    To anyone interested: I have made a plugin that does what paulwp has shared here and I will gladly pass it along to anyone who needs it.

    paulwpxp

    @paulwp

    Font hero

    Hi everyone,

    It turned out that the code above works because of there’s something exclusive about how this particular function add_theme_support() works in WordPress, if interersted see #L1291-#L1294 in http://core.trac.wordpress.org/browser/tags/3.5/wp-includes/theme.php

    So to make a default header image in Twenty Twelve’s Child, it’s just a matter of defining only $arg we want. Here is the code, just copy and paste into child’s function.php, this code is tested.

    /**
     * add this to TwentyTwelve's Child theme's function.php
     * to define default header image which TwentyTwelve doesn't have
     */
    function mytheme_custom_header_setup() {
    	// $args in add_theme_support() in child theme will auto override what defined in parent's
    	// see http://core.trac.wordpress.org/browser/tags/3.5/wp-includes/theme.php#L1292
    	$args = array(
    		'default-image' => get_stylesheet_directory_uri() . '/images/mythemeheader.jpg',
    	);
    	add_theme_support( 'custom-header', $args );
    }
    // add it the same way Twenty Twelve does
    add_action( 'after_setup_theme', 'mytheme_custom_header_setup' );

    @paulwp: As I had mentioned, I have made a plugin of the code you have posted here, and I did that because (and as a rookie) I had read something somewhere about a plugin occasionally being preferable over an accumulation of things in functions.php. Either way, however, someone had suggested I submit the new plugin to the repository…and it has been accepted. But since I would/will be showing your username as the contributor of its code, I have come here again to first ask your permission for that mention of you.

    Many thanks.

    edit: Also, a link to this thread will be the one (and only) listed or shown anywhere in relation to the new plugin.

    paulwpxp

    @paulwp

    Font hero

    @leejosepho

    Please go ahead, feel free to do whatever, credit to me is totally unnecessary, it’s just a piece of code anyway. It’s good that you make it useful for more people, and folks with higher coding skill can improve upon too.

    In the end we all benefit. 🙂

Viewing 15 replies - 1 through 15 (of 31 total)
  • The topic ‘[Resolved] Setting default header image in child theme’ is closed to new replies.
Skip to toolbar