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
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' );
See the classes of body
single single-portfolio postid-22 siteorigin-panels fixed-header no-slider dark-header --- on portfolio
page page-id-7 page-template page-template-template-portfolio-gallery-php siteorigin-panels fixed-header no-slider dark-header --- on categories.
You can add your specific background using that classes.
.single-portfolio .header wrapper{
background: xxx;
}
and
.page-id-7 .header wrapper{
background: yyy;
}