The Custom Post Background WordPress Plugin

->> Download Version 1.2.0.0

This plugin was designed by a college buddy named David Sherret who lives over on DavidSherret.com. He may or may not be open to suggestions for changing the plugin.

The Custom Post Background plugin for WordPress adds a great deal of visual customization ability to your blog posts and page appearances. It allows you to easily change the background of individual blog posts/pages using CSS or an image URL (with or without a x/y/both repeat).

At the main menu, CPB lists all of your pages/posts and displays any background settings that are set. For any page, clicking on the edit button will open up a sub-menu with fields where you can then make your background customizations.

custom post background screen The Custom Post Background WordPress Plugin

As you can see, you can change the background with CSS/URL of image to apply to only the background of the post, only on the background of the home/main page, or both pages.

The ”Color” field option allows you to quickly make background changes using the background-color CSS code. You can enter any color (such as “red,” “blue,” “green”) or enter a hex value, like: #A9A7A7. You can also change the whole page background (not just the post background) of any individual post with the ”Display as page background on post page” option.

Related posts

Tags:


56 Responses to “The Custom Post Background WordPress Plugin”

  1. Jackie says:

    Hi hope all is well!
    I loaded this plugin and I can seem to find this (main menu, CPB lists all of your pages/posts and displays any background settings that are set.)I have not been able to find any way to change the background on a post. I have a word press can anyone help me please?

  2. admin says:

    Hey Jackie,

    The above screenshot is actually taken from an older version of custom post background (I will get around to updating that). In v.2, you need to click on ‘Custom Post Background’ under the settings tab in your admin cp. Then you can edit the background of each page individually by clicking the ‘edit’ button to the right of each listed page.

  3. Dick Boot says:

    hi there,

    Posted this in the wrong section allready…:)
    I just discovered your Custom Post Background plugin and wanted to say: this is great!!
    Would such a thing also be possible for the headings of the pages/posts?
    It would be very nice to choose a heading color that matches or compliments the backgrounds.

    Also: i found this script that scales your background images allways 100% in height. Works perft in HTML. Could this work with your plugin aswell?

    =========

    #background
    {
    height:100%; position: absolute; z-index: -1; top: 0; right:0;
    }

    =========

    many thanx in advance!
    best regards
    dick boot
    the Netherlands

  4. Dick Boot says:

    hmmm, try that again without the

    =========
    head

    style type=”text/css”
    #background
    {
    height:100%; position: absolute; z-index: -1; top: 0; right:0;
    }
    /style

    /head

    body
    img id=”background” src=”images/back.jpg”/
    =========

  5. admin says:

    Hey Dick,

    Glad you like the plugin! It was designed by a friend of mine named David Sherret.

    I thought you would be able to change the background of titles by inserting a custom CSS style for that element. Unfortunately, I don’t think the option to insert custom CSS via the CSS field in Custom Post Background is working. As long as you have the correct location of the header element it should work so I will let David know and ask him if he could fix it. I will also ask him if he could make the header background color change a menu option — it should be very easy to do.

    For now, I guess you will have to stick to altering the header styles manually in your style.css file. You can create a separate header class for each post/page and change the background that way.

    I will also ask him if he can integrate that snippet of yours and possibly have it run as a checkbox option. That is an incredibly useful snippet by the way, in fact I was just looking for something like that to use on a site of mine, with an image background that fudges on high resolution monitors. I heard there was a feature coming out in CSS3 that would allow for relative scaling of background images. But for now I guess we have to use things like that.

  6. Dick Boot says:

    hi admin,

    thanx for the reply. i am sorry to hear that the scaling thing can not be implemented right now…:( but thats how it is i guess…:)
    btw, it is not the header background color i want to change but the color of the heading txt itself.

    anyway, thanx for the reply and is there a way i can email David Sherret myself?

    many thanx!

    best regards,
    d.

  7. Dick Boot says:

    ok, i will say it myself. i’m an idiot…:)
    i can change the color of headings in the post itself…duh

  8. Toan says:

    The link above to wordpress.org/extend doesn’t lead to version 2.0.0; it leads to 1.2.0. Please correct.

    • admin says:

      My bad mate, there is only two versions:
      Version 1.1.0.0 and Version 1.2.0.0. The latter is the current version. So the link does point to the current version (I will edit that).

  9. admin says:

    @ Dick Boot

    Oh, okay. You should be able to change just the heading text color itself with Custom Post Background as well but, like I said, the insert CSS field does not seem to be working currently.

    Are you looking to change the header text color for all posts site-wide? If you are going to do that site-wide then the best way to do that would be to edit your templates style.css file. I can tell you how to do that specifically if that is the case. Let me know.

    I don’t know if David wants me to give out his personal email to people so I will have to ask him myself. He is a nice guy and will probably add your features pretty soon.

  10. Dick Boot says:

    many thanx for your help so far.

  11. Dustin Goerndt says:

    Hey guys, Love the plugin! Is it possible to make the bg image clickable and could you add the url via the plugin’s admin page? Let me know!

  12. Kathi Browne says:

    Am I missing something? I can’t seem to edit the background color until after the post is live… Is there a way to set up the background before others can see it too?

  13. Chelling says:

    The plugin works fine, but I still have a problem: I have placed a image “only on post page” and it will not fill the whole post area. It’s forced inside the text margins. Is it a css code or something I can use to make it fill the rest of the post area? Thanks!

  14. Kathi Browne says:

    I realized I couldn’t enter the color chart number (example: ffccff) but rather “pink” but how can I get a lighter (or faded) color? is there a chart somewhere on what is a valid entry?

  15. Kathi Browne says:

    Duh… I wasn’t entering # in front of the hex.

  16. jason says:

    The HTML does not validate.
    The plugin always places code into the content area, which is ok for placing an image in the page content area.
    But it also puts code there when it tries to define a css style for the body, a background-image, to place an image in the page background.
    The code also leads to creating an open paragraph tag to precede the css style tag, which does not get closed.

    Could the plugin instead generate a style definition in the file header and place a body background-image there and thus validate correctly?

    • Henk says:

      Plugin works, on the few post/pages I’ve tested with.. but like Jason pointed out before.. It put the style in the body, which means it does not validate..

      Editing custom-post-back_post.php by changing STYLE to style reduces the number of warnings to 1 in my site…

      Still ashame it breaks validation…

  17. Dilip Dabrai says:

    Hi Gurus,
    I can’t say if like or dislike the plugin as I cannot get it to work I have followed the instructions and it says background updated but when going live cannot see the image I have used an image in the media library nothing in css as I don’t know enough about css can somebody please help as I would dearly like to use this plugin. I can supply the wp admin login details if somebody would be kind enough to help.
    Thanking everybody in anticipation
    Best Regards
    Dilip Dabrai
    PS I AM A NEWBIE PLEASE BE PATIENT AND THANKS YET AGAIN

  18. Mark says:

    Fantastic plugin – thank you!
    I have implemented it for all my page background imagesat http://www.ChicagoWindowExpert.com

    Everything is great except there is no listing in your setup page for the Home page. I have configured my blog so that the latest post is displayed on the home page. When people come to the site and see the home page, there is no background image. What can I do? Many thanks.
    Mark

  19. Chris says:

    Hey Mark,

    It should work for the home page as long as you have “Display on main/archive page” or “display on both pages” selected.

    That will only affect the post area for recent posts on the home page. It will not affect the background of the home page itself. However you can do that easily by changing a few line[s] in style.css.

  20. Chris says:

    @ Dilip

    I just need to know: are you putting in the URL of an image using the “Image from URL” option or are you using the “Image from Media Page” option and selected an image you already have in th media library? You might want to try both.

    You also might want to try selecting “Display on both pages” under “Display type.”

  21. Brad says:

    Great plug-in, thank you!

    My question is: I’ve altered the background of a specific post, which it has done fabulously. However, the rest of my posts now only show a single instance of my main background (not tiled across the screen as it is on my home page.) Why is this, and should I be adding something in my style sheet?

    Thanks so much!

  22. Chris says:

    Hey Brad,

    I took a look at your blog and it looks like you already fixed the problem. I would guess that the plugin was adding something in your CSS that caused all of the background images to inherit a background-repeat:none property … but background-repeat does not inherit.

    Could it be that you removed the background-repeat property in your single and page template files?

    • Steve says:

      Hey Chris,
      First off, your plugin is really great for the most part and I will be sure to add a great rating. Thank you very much to you and anyone else that helped you create it. It worked perfectly on the pages that I needed custom backgrounds for, however, it has caused some odd issues throughout my site, exactly like the issues “Brad” above was having on April 15th, but didn’t find a fix in your response since he had already fixed it.

      The background that I already had in my design is styled to tile along the x-axis only, and looked fine before I installed the plugin. However, once I installed the plugin, the background on most of my pages no longer tiles properly (or at all for that matter). I even tried deactivating the plugin to see if that made a difference, but they were still messed up. The weird thing about it, is that my background still works fine on a few of the pages, but is not repeating horizontally on the majority of pages (over 300 in all).

      For an example of what I’m talking about, please check out the links below when you get a minute.

      Custom Background – Added using your plugin and works great
      http://hardicanstudios.com/woodbros/?p=649

      Correct – Original background tiling still works fine on this page
      http://hardicanstudios.com/woodbros/?page_id=482

      Incorrect – Most pages look like this now instead
      http://hardicanstudios.com/woodbros/

      I’ve been fighting with it for a while now to see if I could fix it on my own, but I’ve checked (and rechecked) my css files and can’t seem to figure it out. Any advice would be hugely appreciated. I brought in the custom backgrounds via URL as opposed to linking from the media gallery, and I am using a fresh install of WordPress 3. I will gladly provide any files that you think would help solve this issue. Thank you in advance for anything you can do to help me out.

      - Steve

  23. Larry Wilcox says:

    This plugin still says compatible up to WP 2.7 even though I know it works on 2.92. Is this going to be updated so people aren’t worried about using it?

  24. Chris says:

    Hey Larry,

    Thanks for pointing that out. I will try to get a hold of David so he can change that.

  25. Mark says:

    Hi Chris, this refers to your comment #24 above.
    Can you suggest the lines of style.CSS that would allow the the background of the home page itself to display the background image?

    Again, thanks for a marvelous plugin!

  26. Chris says:

    Hey Mar, I am working on a php script right now that will allow you to to change the background of only the frontpage. I will let you know when it’s done.

    The answer I posted here before didn’t work so I deleted it.

  27. Mark says:

    Chris,
    I will be very grateful!

  28. [...] the Custom Post Background, WordPress users can change individual post or page backgrounds in the admin control panel. But [...]

  29. James says:

    Is it possible to use the use css to right adjust the images? I’m unable to set something like:

    .floatright { float: right; margin: 0px 0px 5px 5px; }

    to do anything. I’d like to not have my images take up the whole background. Great plugin!

  30. James says:

    background-position:right top;

    Works like a charm!

  31. Luke says:

    Hey great plugin and thanks for contributing! Is there a way that I can change the color of the sidebar as well? I am using my theme as a CMS for a website and would love for each page to be a completely different color as well as the sidebar to compliment it.

    Thanks in advance!

    • Chris says:

      Hey Luke,

      The best way you can change the sidebar background is to change the css for your sidebar.php.

      If you want the sidebar do be different on different pages, you’ll have to use PHP.

  32. Navin says:

    Great plugin!
    Is is possible to have a different background on a category page?

    Thanks

    • Chris says:

      Hey Navin,

      No, not with the plugin. But you can easily do it manually. Are you looking to change the backround of ALL the category pages or just one? And when you mean category pages, do you mean the page that comes up after you click on a category, what would be archive.php?

  33. salvatore says:

    Hi, I installed the plugin custom post background on my blog wordpress 2.9.2, but when I go to the menu of the plugin out the following text: “There are currently no backgrounds. Please add one below.” How do I fix this?
    thanks

  34. TJ says:

    This is a great plugin. Working on a site using it for page backgrounds as its more of a simple cms site.

    the problem I am having is that I changed the tag that the image would be appended to, to a #container div. I have overlays and other crap to deal with. Anyway, its now pushing the background down. I have checked and rechecked the css and can’t seem to figure out the issue. Does the plugin do any css styling on its own?

    the site I am working on is planetbronze.ravennainteractive.com , you can see the background image and how there is a pseudo line right below the main nav. I ultimately just need to know if the plugin is adding any other styles than background-image and background-repeat

  35. TJ says:

    Ok never mind that last point; the problem is that if I let the plugin attache the image to the body tag, then the background image won’t center under the content of a centered layout.

    help!!!

  36. tammy says:

    I have installed this plugin on my site but google is now not indexing the 2600 pictures i have on my site. Is this plugin affecting this in anyway?

  37. I just tested the plugin in my site. I selected Sell Online page and changed it to a different color just to see what happens. I did not like the try out color so I went back to select Disable – do not display. Yet only one page is back to its normal color, the rests, still remain to the color I do not want. I do not want to go to each one post and page to change to Disable – do not display. It will be too much work.
    What is the easiest way to make all of them back to their original color?
    Please let me know. Thank you.

  38. Hi Chris,

    This plugin seems to be exactly what I’m looking for, but I can’t get it quite right. Wondering if you can help me out.

    I have a large BG image throughout my entire site that I want to change for some posts. The BG image is inside the site content-wrap tags and therefor is aligned behind my content. But when I replace using this plugin, it’s no longer inside those tags, so it aligns to the top-left.

    I have a feeling this is an easy fix, but I’m scratching my head way too hard at the moment..

    Thanks for the great plugin and support!

    John

  39. Hey, I got it! In case anyone is facing similar challenge:

    Change this:

    if($results->displaytype == 3) //DISPLAY AS PAGE BACKGROUND
    {
    $new_data = ”;
    $new_data .= ‘body {‘;
    }

    To this:
    if($results->displaytype == 3) //DISPLAY AS PAGE BACKGROUND
    {
    $new_data = ”;
    $new_data .= ‘#content-wrap {‘;
    }

    Where #content-wrap is likely specific to your style sheet and may be different.

    SWEET!

  40. Kitedaso says:

    Hi,

    Can you please tell us how to change some file to still by defaul Display Disable… then only if I want some post with image background choice that option. Will be better.

    thanks in advance

  41. jerel says:

    I have had some good results using “Custom Post Background” plugin on individual post pages but it has no effect on the main blog/post page (see http://write4you.biz/blog ).
    Is there any simple way to customise the css so that blog pages and posts have a different background image to the main theme background image?
    Thanks
    jerel

  42. Linr says:

    Hi,only the admin account has the manager menu “custom post background”.if use the editor account,the menu will invisible.How to?

  43. Flash Buddy says:

    Linr brings up a point I hadn’t considered. I’ll be interested to hear the answer.

    When installing for a client, I wouldn’t expect them to know CSS enough to position the background (top center left right etc) or to set it to scroll or be fixed. Suggest a pull down radio button to set background-attachment and background-position. Easy way would be a descriptive key with samples of what to put in the CSS box. What are your thoughts on this?

  44. sabuthai2010 says:

    I have try this plugin it’s work and I am happy..Thankssss

Leave a Reply