WordPress 3.0 Custom Background Support

In WordPress 3.0, it will have, additional to the Custom Header Image support, also a Custom Background Support. A first snapshot is in the current trunk. To use the functionality, the theme needs in functions.php this line:

add_custom_background();

After that, there is in your backend under Appearance the menu Custom Background available.

WordPress 3.0 Custom Background Step 1

After uploading an image, you have the option to activate "Tile the background" and delete the background image.

WordPress 3.0 Custom Background Support Step 2

Here the result with the new Theme Twenty Ten.

Theme Twenty Ten with Custom Background Support

Comments are closed.

38 comments

  1. Ben Huson

    That's handy. Would also be nice to have an option to align left, right or center if you uploaded a big image that you didn't want to tile.

  2. Michael

    Ben: Yes, that would be nice.

  3. Warren

    Thats awesome, is there somewhere we can download WP 3.0?

  4. Michael

    @Warren: You can download the last revision from http://core.trac.wordpress.org/browser/trunk.

  5. Carlos

    Oh, this is glorious!

  6. Ben

    I'm not that impressed to be honest. I stopped using the custom header uploader, and wrote my own. The custom header uploader constantly threw up errors for people, or just loaded a white screen, it was a support nightmare. Since creating my own version there's been 0 support.

    Using my theme Elemental I could add a background uploader very quickly and easily.

  7. Theo

    Thank you for the useful information ! Keep up the good work

    Cheers

  8. Tomáš Kapler

    I do not understand - will this be a wordpress core function or theme function. Custom header is afaik default theme function, this seems like core function. It would be bad if i would have to define all design things on tons of places. I would prefer theme functions or just some core support with theme overiding.

  9. Michael

    Tomáš, its a core function. See wp-admin/custom-background.php

  10. Rinaldi Syahran

    nice custom background support in wordpress 3.0 make your work easier.

  11. Diane Bourque

    This will make it so much easier for many bloggers to update the background image of their blog. Up until now, they needed a web developper to do that. Now, they'll be able to do it from their dashboard (after modification to functions.php). Sounds good. Keep up the good work.

  12. Kevin

    Ben,

    I agree 100% on the custom header uploader. I ended up creating my own. I went from lots of complaints to zero complaints and even some compliments.

  13. ANdre Foisy

    What a nice a cool feature even though several templates allow this, not all of them of course, that makes it easier to have a personalized BG :)

    Nice!

    Andre Foisy

  14. amit payasi

    Nice Post. I am waiting for 3.0.

  15. Ade

    Anybody know of a theme implementing custom backgrounds for wordpress.com hosted blogs?

  16. Jeff Walden

    Further options beyond tiling worth adding: alignment (also noted in previous comments), resizing (in-browser where possible using CSS3's background-size or vendor-specific versions, or perhaps using server-side image resizing as fallback, possibly with a user-visible caveat that this support is "experimental" and "may not work in all browsers" or somesuch), and attachment (or lack thereof) to the canvas via background-attachment.

  17. Michael Oeser

    Is there any known reason why the custom background feature doesn´t work?. I tried it in a theme of mine and although the background panel is there in the backend the changes do not take effect in the frontend (theme).

    No matter if I just change a color or if I use an image. Nothing changes. It works with the TwentyTen but not with my own theme.

    Any thoughts?

  18. Govindji Patel

    I am using the default twenty ten theme and I try to upload a custom background image it tells me that image is uploaded yet I do not see the image like you have on this lesson.

    when I click on media library I see it there is there anything I need to do to use it other than adding
    add_custom_background(); in function.php

  19. Michael

    @Govindji: The background image does not exist.
    background-image: url("http://gbpcentral.com/files/2010/07/background1.png")

  20. Govindji Patel

    When I upload the image I see the page as is on this image

    http://gbpcentral.com/images/background.png

    if you notice at top says background image in bold but no image.

    If I click on remove image that goes away

  21. Michael

    @Govindji: the last thing, what you should try is to check the folder/file permissions. Maybe the webserver can't read the file.

  22. Govindji Patel

    Thank you Michael for prompt reply

    What folder/file should I change permission on so that the background can be uploaded as is the folders are 755 and files are 644

  23. Michael

    We have here 666 for the files. Write and publish a little test post and insert a image in the post. If the image is shown, your file permissions are ok.

  24. Govindji Patel

    Thank you for your help Michael

    I found out why I was having problem and I am posting so that other visitors can do the same if they having the same problem

    I upgraded form 2.9.2 to 3.0 and they have changed the file to upload in 3.0 so you have to make a minor change htaccess file as follows to make it work

    need to modified htaccess file and change the path as below..

    RewriteRule ^(.*/)?files/(.*) wp-includes/ms-files.php?file=$2 [L]

    because previously it was with RewriteRule ^(.*/)?files/(.*) wp-content/blogs.php?file=$2 [L]

    and if you are using WPMU 3.0 blog.php is no longer in use, so far everything is working fine for me.

    Govindji Patel

  25. wuzisname

    nice info but for some reason it doesn't work, word-press reports:
    Unable to create directory /home/sblain/public_html/wp-content/uploads/2010/07. Is its parent directory writable by the server?

  26. Andy Hawkins

    Hi

    I use the twenty ten theme with success. It is easy to modify, but some challenges came up during my process. I've changed the Header image (using Appearence/Header) and it occurs on all my pages so that's ok until now. My new challenge is this: Is it possible to have one Header on my FrontPage (A Flash Header or Animated Gif) and another Header on all my other pages? I don't find out how to do it because the Appearence/Header only gives me the solution to put a Header image that reflects to all pages.

    I hope anyone can give me a good solution with a brief description.

    /Andy

  27. StevieG

    I'm beginning to use twentyten and have added a background image. It works just great apart from the positioning. Is there a way to specify top/bottom as you can with left/right/center?

  28. Jason

    @Andy Hawkins,

    I think the Dynamic Headers plugin would be something you can use. It is not something i have used but it sounds like it would fit your needs perfectly.

    http://wordpress.org/extend/plugins/dynamic-headers/

    Or you could customise Page / Post Templates.

  29. Daniel

    I would like to see a bg function that allows bg to be changed on schedule, so that the bg image could be scheduled to change according to time of day or season. If anyone has any ideas how to do this please let me know...

  30. TekxY

    Nice, the Custom Background Support was one of the first things i noticed when i dled this theme.

    Btw I just made a traslation of Twenty Ten to spanish, the traditional way, I'll leave you the link in case some of your readers can benefit from using it.

    http://geektual.com/tema-twenty-ten-para-wordpress-traducido-al-espanol/

  31. Thomas

    Hi

    Is there any way I can make the are wish in the example abowe is white (where the text is) transparent?

7 pingbacks

  1. WordPress 3.0: Arrière-plan Personnalisé | BlogDuGeek
  2. Сменный фон background в WordPress 3.0 - Custom Background | Wordpress inside
  3. L’Hebdo WordPress : WordPress 2.9 – WordPress 3.0 – BuddyPress | WordPress Francophone
  4. Fireside Chat with Dougal Campbell, An Early WordPress Developer « WordPress Community Podcast - Online Radio - WebmasterRadio.FM
  5. Fireside Chat with Dougal Campbell, An Early WordPress Developer | The WordPress Podcast
  6. 10 of the Best Tutorials to Get You Up to Speed With WordPress 3.0 - WordPress MU and BuddyPress plugins, themes, support, tips and how to's
  7. Einfaches Autoresize für die WordPress Hintergrundbild-Funktion – bueltge.de [by:ltge.de]