Best practice for displaying a different header image on each page?

Community Forums Forums Design Tips and Tricks Best practice for displaying a different header image on each page?

This topic is: not resolved

Tagged: , ,

This topic contains 3 replies, has 2 voices, and was last updated by  kworthington 1 year, 9 months ago.

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #14410

    kworthington
    Participant
    Post count: 17

    Hi, I’m using the Pixel Happy child theme (http://demo.studiopress.com/pixelhappy/) and I’m wondering what the best way is to display a different header image / logo (images/header.png) at the top of pages.

    Is there a plugin available that will do this? Or should I use PHP,  CSS, or a mixture of PHP and CSS to make it happen? Any examples would be really helpful too.

    Thank you,

    Kevin

    #14421

    SoZo
    Moderator
    Post count: 1573

    You can use body classes to create separate style rules.


    John “Nicolas Flamel” Wright | SoZo’s design| John Wright Photography

    #14457

    kworthington
    Participant
    Post count: 17

    Thanks John, I’ll check it out.

    #14509

    kworthington
    Participant
    Post count: 17

    Yes, that got me on track – thank you!

    For anyone else using Pixel Happy specifically, I used:

    .page-id-25 .header-image #title-area, .header-image #title-area #title, .header-image #title-area #title a {
    background-image: url(http://mydomain.com/wp-content/uploads/2013/01/Page25Header.png);
    background-position: initial initial;
    display: block;
    float: left;
    width: 960px;
    height: 120px;
    margin: 0;
    padding: 0;
    text-indent: -9999px;
    overflow: hidden;
    background-repeat: no-repeat no-repeat;
    }

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.