Title: multiple headers possible
Last modified: January 27, 2022

---

# multiple headers possible

 *  Resolved [davidsteel](https://wordpress.org/support/users/davidsteel/)
 * (@davidsteel)
 * [4 years, 4 months ago](https://wordpress.org/support/topic/multiple-headers-possible/)
 * Hi Ben,
 * is it possible to show different headers (images) on different subpages with 
   one code snippet?
 * with the add-on “unique headers” it does not work and my php knowledge is too
   weak for the adjustments and additions needed for the solution with a second 
   header.php.
 * thank you & still in love with tracks 🙂
    Dave
 * The page I need help with: _[[log in](https://login.wordpress.org/?redirect_to=https%3A%2F%2Fwordpress.org%2Fsupport%2Ftopic%2Fmultiple-headers-possible%2F%3Foutput_format%3Dmd&locale=en_US)
   to see the link]_

Viewing 10 replies - 1 through 10 (of 10 total)

 *  Theme Author [Ben Sibley](https://wordpress.org/support/users/bensibley/)
 * (@bensibley)
 * [4 years, 4 months ago](https://wordpress.org/support/topic/multiple-headers-possible/#post-15302369)
 * Hi Dave,
 * Glad to hear you’re still enjoying Tracks 🙂
 * Since the Header Image is a background image applied to a div element, you can
   swap it out with CSS.
 * Here’s an example that will target [this page](https://www.lostinspace.ch/lostinspace/):
 *     ```
       .page-id-10 .header-image {
         background-image: url('https://www.lostinspace.ch/wp-content/uploads/2017/05/header_lostinspace.jpg');
       }
       ```
   
 * There are two parts you need to edit.
 * First, replace the “10” in “page-id-10” with the page you want to target. You
   can get the page ID from the browser address bar in the editor ([tutorial](https://www.competethemes.com/blog/find-page-id/)).
 * And second, you’ll want to update the URL to point to a new image on your site.
   The URL in the snippet is pointing to your existing header image.
 * If you want to use that snippet for multiple pages, you can just copy and paste
   it and repeat it as many times as needed.
 *  Thread Starter [davidsteel](https://wordpress.org/support/users/davidsteel/)
 * (@davidsteel)
 * [4 years, 4 months ago](https://wordpress.org/support/topic/multiple-headers-possible/#post-15303563)
 * thank you for the feedback and i thought it will be so easy! but unfortunately
   it does not work. must the size of the image be identical to the “normal” header
   image?
 * i also tried it with other IDs, but even there my header stays.
 * **subsite**
    [https://www.lostinspace.ch/campervan/](https://www.lostinspace.ch/campervan/)
 * **css edit**
    .page-id-1862 .header-image { background-image: url(‘[https://www.lostinspace.ch/wp-content/uploads/2022/01/header_campervan_05.jpg&#8217](https://www.lostinspace.ch/wp-content/uploads/2022/01/header_campervan_05.jpg&#8217););}
 *  Thread Starter [davidsteel](https://wordpress.org/support/users/davidsteel/)
 * (@davidsteel)
 * [4 years, 4 months ago](https://wordpress.org/support/topic/multiple-headers-possible/#post-15303573)
 * in the post before a apostrophe at the end is not displayed correctly …05.jpg’);
 *  Theme Author [Ben Sibley](https://wordpress.org/support/users/bensibley/)
 * (@bensibley)
 * [4 years, 3 months ago](https://wordpress.org/support/topic/multiple-headers-possible/#post-15307863)
 * There are a few things that could be happening.
 * First, since you’re using the Autoptimize plugin, you may have to empty your 
   cache before the new CSS takes affect.
 * Otherwise, the CSS may be getting overridden by the default CSS. You can try 
   adding an `!important` tag, like this:
 *     ```
       .page-id-1862 .header-image {
         background-image: url('https://www.lostinspace.ch/wp-content/uploads/2022/01/header_campervan_05.jpg') !important;
       }
       ```
   
 * If these solutions still don’t help, please link me to the page where you’re 
   adding a new header image and that will help me debug the issue.
 *  Thread Starter [davidsteel](https://wordpress.org/support/users/davidsteel/)
 * (@davidsteel)
 * [4 years, 3 months ago](https://wordpress.org/support/topic/multiple-headers-possible/#post-15308404)
 * cool, the “important” was the solution.cache, cookies & co. I had of course already
   deleted or deleted all caching plugins (also work in IT, but unfortunately very
   little knowledge in html, php, etc.).
 * many thanks ben & I have you respectively the company now added to my links and
   in the footer, because I’m just incredibly happy with the theme and the support
   🙂
 * cheers, dave
 *  Thread Starter [davidsteel](https://wordpress.org/support/users/davidsteel/)
 * (@davidsteel)
 * [4 years, 3 months ago](https://wordpress.org/support/topic/multiple-headers-possible/#post-15308607)
 * and would you also have the code ready so that the menu (id-1862) is not displayed?
 * thx, dave
 *  Theme Author [Ben Sibley](https://wordpress.org/support/users/bensibley/)
 * (@bensibley)
 * [4 years, 3 months ago](https://wordpress.org/support/topic/multiple-headers-possible/#post-15311334)
 * Thanks, Dave!
 * Here’s how you can hide the primary menu on a specific page:
 *     ```
       .page-id-1862 .menu-primary-items,
       .page-id-1862 .menu-primary .menu-unset {
         display: none;
       }
       ```
   
 *  Thread Starter [davidsteel](https://wordpress.org/support/users/davidsteel/)
 * (@davidsteel)
 * [4 years, 3 months ago](https://wordpress.org/support/topic/multiple-headers-possible/#post-15313901)
 * thanks Ben, but this code disables me everything and not only the menu “campervan”.
   i do not use the function “menu” in wordpress and have all pages set up individually
   or only with the function “parents”.
 *  Theme Author [Ben Sibley](https://wordpress.org/support/users/bensibley/)
 * (@bensibley)
 * [4 years, 3 months ago](https://wordpress.org/support/topic/multiple-headers-possible/#post-15315311)
 * Okay I see. That code was written to hide the menu on page 1862, but this new
   snippet will hide the menu item for page 1862:
 *     ```
       .menu-primary .page-item-1862 {
         display: none;
       }
       ```
   
 * I’d also recommend trying out the menu feature in WordPress. It makes it pretty
   easy to choose which items appear in the menu and reorder them. You can also 
   edit the menu labels independently of the page titles, which can be helpful.
 *  Thread Starter [davidsteel](https://wordpress.org/support/users/davidsteel/)
 * (@davidsteel)
 * [4 years, 3 months ago](https://wordpress.org/support/topic/multiple-headers-possible/#post-15342996)
 * Thx Ben – it works fine 🙂

Viewing 10 replies - 1 through 10 (of 10 total)

The topic ‘multiple headers possible’ is closed to new replies.

 * ![](https://i0.wp.com/themes.svn.wordpress.org/tracks/1.81/screenshot.png)
 * Tracks
 * [Support Threads](https://wordpress.org/support/theme/tracks/)
 * [Active Topics](https://wordpress.org/support/theme/tracks/active/)
 * [Unresolved Topics](https://wordpress.org/support/theme/tracks/unresolved/)
 * [Reviews](https://wordpress.org/support/theme/tracks/reviews/)

## Tags

 * [header](https://wordpress.org/support/topic-tag/header/)
 * [php](https://wordpress.org/support/topic-tag/php/)

 * 10 replies
 * 2 participants
 * Last reply from: [davidsteel](https://wordpress.org/support/users/davidsteel/)
 * Last activity: [4 years, 3 months ago](https://wordpress.org/support/topic/multiple-headers-possible/#post-15342996)
 * Status: resolved