Hi,
I just tried this out and it’s working well for me:
To have a custom header image on just one page you can use this plugin:
WP Display Header
but….
You’ll need to make some changes to your header.php file. To include this in your child theme you’ll need to:
1. Copy all the code from your header.php in your parent theme.
2. Paste it into a new file called header.php in your child theme folder.
3. Look for this code:
<?php if (of_get_option('logo_image')) : ?>
<a>" class="logo-img"><img src="<?php echo esc_attr( of_get_option('logo_image') ); ?>" alt="<?php bloginfo( 'name' ); ?>" /></a>
<?php else : ?>
<h1 class="site-title"><a href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></a></h1>
<h2 class="site-description"><?php bloginfo( 'description' ); ?></h2>
<?php endif; ?>
4. Delete it and replace it with:
<img src="<?php header_image(); ?>" height="<?php echo get_custom_header()->height; ?>" width="<?php echo get_custom_header()->width; ?>" alt="" />
5. Create a new file in your child theme folder called ‘functions.php’ and place this code inside it:
<?php
add_theme_support( 'custom-header' );
?>
6. Go to your Dashboard – Plugins -> Add New and search for WP Display Header. Install and activate.
7. Go to your Appearance –> Header and upload the header image file you want to use on your front page and click ‘Choose Image’.
7. Repeat the process and upload the image file you want to use on your ‘Spiritual Virtual Assistant’ page but DON’T click ‘Choose Image’.
8. Instead, go to your Dashboard – > Pages and click ‘Edit’ under your ‘Spiritual Virtual Assistant’ page.
9. Scroll to the bottom and you should see a box called ‘Header’ and be able to click the radio icon next to the image you want to use.
10. Click update and you should have a custom header on just that particular page.
As regards your child theme, these are the exact steps I took to set it up:
1. Create a new folder in wp-content/themes/ called
sugar-and-spice-child
2. Create a new file called ‘style.css’ and paste in the following code:
/*
Theme Name: Sugar and Spice Child
Theme URI: http://example.com/twenty-fourteen-child/
Template: sugar-and-spice
Version: 1.0.0
Text Domain: sugar-and-spice-child
*/
@import url("../sugar-and-spice/style.css");
/* =Theme customization starts here
-------------------------------------------------------------- */
.page-id-4 {
background-image: url("http://subtlepatterns.com/patterns/congruent_outline.png") !important;
}
3. Dashboard – Appearance -> Themes & Activate ‘Sugar and Spice Child’
If could be that you set some styles under – Appearance -> Theme Options and you just have to apply those again in your child theme.
I hope that helps you out 🙂
– Luke
