尝试在某些页面上显示标题背景图像

Question

I am trying to add some css to portfolio pages only on my word press site. An example page is: http://www.1aproductions.co.uk/portfolio/22/

The css code i am trying to add is:

.header-wrapper {
background-position:top;
background-color:transparent !important;
background-image:url('http://www.1aproductions.co.uk/wp-content/uploads/2014/06/Florence-Nightingale-smaller-no-flo.jpg') !important;
background-size: 100% auto;
} 

Which would display a similar effect to the header on this page (if I could only get it to work!) http://www.1aproductions.co.uk/work/?cat=dramas

Any Help would be greatly appreciated!

Thanks P

Answer 1

It looks as though portfolio is a custom post type. So try this:

function my_custom_css() {
    if ( is_singular( 'portfolio' ) ) {
        echo "<style>
            .header-wrapper {
                background-position:top;
                background-color:transparent !important;
                background-image:url('http://www.1aproductions.co.uk/wp-content/uploads/2014/06/Florence-Nightingale-smaller-no-flo.jpg') !important;
                background-size: 100% auto;
            }
        </style>";
    }
}
add_action( 'wp_head', 'my_custom_css' );