Change header image on different pages

  • Author
    Posts
  • #106965

    hirschjm
    Member

    I am looking for a custom CSS work-around to the following problem:

    Marquee only allows one header image to be displayed throughout the site – unless you select the custom randomizer feature, which I don’t want, since I have specific header image in mind for the page. Can anyone help me code this?

    The link to the page is: https://joehirsch.me/contact/

    The link to the image I want as the header for this page only is: https://joehirschdotme.files.wordpress.com/2017/02/speaking_3.jpg

    I want to keep the current header image I have for the landing page.

    Thanks,
    Joe

    The blog I need help with is joehirsch.me.

    #107109

    thelukemcdonald
    Theme Author

    Hi Joe!

    Thanks for the clear instruction for what you are looking to do; that makes things easy. I’ve provided the custom CSS below to do what I believe you are looking for.

    .page-id-213 .site-header {
      background-image: url(https://joehirschdotme.files.wordpress.com/2017/02/speaking_3.jpg);
    }

    I hope that helps.

    #107123

    hirschjm
    Member

    Thank you! It worked.

    Trying to use the same work-around for other pages, too. Using the same code you provided, I entered this in the CSS customizer:

    .page-id-154 .site-header { 
      background-image: url (‘https://joehirschdotme.files.wordpress.com/2014/11/joe-hirsch_2.jpg’);

    Unfortunately, it did not work!

    The link to the image is listed above in the code.

    The link to the page is: https://joehirsch.me/about/

    Can you tell me how I would replicate this work-around any time I want to change the header on just a single page? And how do I find out the page ID number to enter in the code? Do I have the wrong page ID number?

    #107124

    hirschjm
    Member

    I’d like to customize the fonts of the secondary menu. Right now, they appear in a much smaller font size compared to the primary menu. How might I make the fonts of the secondary menu the same size as the primary menu fonts, but a different color? Like gray, as opposed to white?

    #107126

    hirschjm
    Member

    Is there a way to “pin” a certain blog to the top of the blog roll, even if it is not the latest blog post to be published?

    #107165

    thelukemcdonald
    Theme Author

    Awesome, glad to hear it worked out for you. It also looks like you may have the other background image to work as it seems to be showing the image you provided in your CSS example.

    As for the other two items you mentioned, I’d recommend creating two new forum topics for each of those. This will help keep this thread on topic and allow other with similar questions to find the answers they are looking for.

    Let me know if you’re still having issues with the background images.

    Thanks!

The topic ‘Change header image on different pages’ is closed to new replies.