Support » Themes and Templates » Background Image for posts

  • Resolved Keller Bear


    Hi. I’m using the very good Two post columns Twenty Eleven child theme by Digital Raindrops and wanted to add a background image to each post excerpt on the blog page.

    Very easily I added some css:

    article {
    	background-image: url(Images/black_board.jpg);
    	background-repeat: no-repeat;

    But this creates a number of problems.

    1. – This image is also added to the pages with single post.
    2. – This image was added to the comments (RESOLVED)
    3. – I want to direct some css to the h1.entry-title on the page with the grid of posts (namely add a bit of margin to push it away from the edge of the image) but know if I do that then the single post pages will be pushed accordingly.

    How do I get rid of the images on the single post and also target the h1.entry-title on the two column page only?

Viewing 6 replies - 1 through 6 (of 6 total)
  • Just to add, I realise I could target the next outer div e.g. article#post-9 but this would be useless as I would have to have separate css for each and every post number in the future.

    Help greatly appreciated!!



    Forum Moderator

    it might help if you can post a link to your site to illustrate the problem.

    generally, look into the existing page specific body_class output;

    for instance .blog for the posts page;
    or .single for single posts.

    Hi alchymyth

    I am still working on the site locally and really haven’t changed anything of great significance.

    I did manage to write in some css that solved half my problem

    .page article {
    background-image: none;

    .single article {
    background-image: none;

    So really my third problem just remains. Do I need to go into single.php and add a style directly in there or is this a complete no-no and styling should be kept in the css file?

    Also, I’m having another problem (and your name keeps popping up so I was hoping I would get your attention!!) that you might have a look at if you have time? it can be found at:




    Forum Moderator

    direct some css to the h1.entry-title on the page with the grid of posts

    check the css class in the body tag of that (web) page; possibly use a tool such as Firebug

    if that is the posts page (blog page), the css class might be .blog

    i.e. to format the h1 on the grid posts page only, possibly use:

    .blog h1.entry-title { ... }

    ok I will try that out, thanks. Will let you know if it works!

    Thanks alchymyth, this worked a treat!

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Background Image for posts’ is closed to new replies.