0

I would like to be able to add a background image to the header area on each inside page of this site. On a static page I would do something like this:

<header class="entry-header" style="background: url('/images/bg_the-firm.jpg')no-repeat left top;">

However, any attempts at inline styling are stripped out by WordPress. I can add a background image using the theme's style.css, but I need to be able to add a unique image for each page: hence the inline styling necessity.

1 Answer 1

2

You will have to specify template directory in your inline background style too. Use it like this.

<header class="entry-header" style="background: url('<?php bloginfo('stylesheet_directory'); ?>/images/bg_the-firm.jpg')no-repeat left top;">

If WordPress strip your inline styles, you can use body classes to add specific styles to each page.

Each page have some body classes, you can find those in page source in any browser. And define your header background like this in your style.css.

body.page-id-6 header.entry-header{background: url('images/bg_the-firm.jpg') no-repeat left top;}

Make sure you define page specific styles at the end of style.css to avoid overwriting it's effect.

3
  • Hi Robert, this is what I added to the page: <header class="entry-header" style="background: url('<?php bloginfo('anchor-engineering'); ?>/images/slider.jpg')no-repeat left top;">, but if you check the page, there is no indication that it is there.
    – forrest
    Commented Oct 28, 2014 at 17:07
  • actually you don't have body classes in your header.php. make sure you have <body <?php body_class(); ?>>.
    – Robert hue
    Commented Oct 28, 2014 at 17:09
  • Your page id is 6 for THE FIRM page so use body.page-id-6. I made changes in code. Add it to at the bottom of your style.css
    – Robert hue
    Commented Oct 28, 2014 at 17:14

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.