How to Set a Default Custom Background in WordPress 3.0

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:og="http://opengraphprotocol.org/schema/" xmlns:fb="http://www.facebook.com/2008/fbml" dir="ltr" lang="en-US"> <head><script type="text/javascript" src="/_static/js/bundle-playback.js?v=HxkREWBo" charset="utf-8"></script> <script type="text/javascript" src="/_static/js/wombat.js?v=txqj7nKC" charset="utf-8"></script> <script>window.RufflePlayer=window.RufflePlayer||{};window.RufflePlayer.config={"autoplay":"on","unmuteOverlay":"hidden"};</script> <script type="text/javascript" src="/_static/js/ruffle/ruffle.js"></script> <script type="text/javascript"> __wm.init("https://web.archive.org/web"); __wm.wombat("http://bavotasan.com:80/tutorials/default-custom-background-wordpress-3/","20110104224328","https://web.archive.org/","web","/_static/", "1294181008"); </script> <link rel="stylesheet" type="text/css" href="/_static/css/banner-styles.css?v=S1zqJCYt" /> <link rel="stylesheet" type="text/css" href="/_static/css/iconochive.css?v=3PDvdIFv" />  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> <meta name="googlebot" content="index,archive,follow,noodp"/> <meta name="robots" content="all,index,follow"/> <meta name="msnbot" content="all,index,follow"/> <meta name="description" content="If you're a theme developer and you want to allow users to set a custom background image or color, activating the feature in WordPress 3.0 is as simple as ..."/> <meta name="keywords" content="Background,background color,background image,bg,custom background editor,functions.php,wordpress 3,"/> <title>How to Set a Default Custom Background in WordPress 3.0 | bavotasan.com</title> <link rel="stylesheet" href="https://web.archive.org/web/20110104224328cs_/http://bavotasan.com/wp-content/themes/bavotasan-2010/style.css?ver=1.0.8" type="text/css" media="screen"/> <link rel="shortcut icon" href="https://web.archive.org/web/20110104224328im_/http://bavotasan.com/favicon.ico"/> <link rel="pingback" href="http://bavotasan.com/xmlrpc.php"/> <link rel="alternate" type="application/rss+xml" title="bavotasan.com 禄 Feed" href="https://web.archive.org/web/20110104224328/http://feeds.feedburner.com/bavotasan"/> <script type="text/javascript" src="https://web.archive.org/web/20110104224328js_/http://bavotasan.com/wp-includes/js/jquery/jquery.js?ver=1.4.2"></script> <link rel="index" title="bavotasan.com" href="http://bavotasan.com/"/> <link rel="start" title="Removing Images from a WordPress Post: Redux" href="http://bavotasan.com/tutorials/removing-images-from-a-wordpress-post/"/> <link rel="prev" title="Elemental Portfolio WordPress Theme" href="https://web.archive.org/web/20110104224328/http://bavotasan.com/articles/elemental-portfolio-wordpress-theme/"/> <link rel="next" title="Simple Text Shadow Effect using CSS3" href="https://web.archive.org/web/20110104224328/http://bavotasan.com/tutorials/simple-text-shadow-effect-using-css3/"/> <link rel="canonical" href="https://web.archive.org/web/20110104224328/http://bavotasan.com/tutorials/default-custom-background-wordpress-3/"/> <link rel="shortlink" href="https://web.archive.org/web/20110104224328/http://bit.ly/hhXLV4"/> <script type="text/javascript" src="https://web.archive.org/web/20110104224328js_/http://ajax.googleapis.com/ajax/libs/swfobject/2.1/swfobject.js"></script> <meta property="fb:page_id" content="137456822940271"/> <meta property="fb:admins" content="586505548"/> <meta property="og:site_name" content="bavotasan.com"/> <meta property="og:title" content="How to Set a Default Custom Background in WordPress 3.0"/> <meta property="og:description" content="If you鈥檙e a theme developer and you want to allow users to set a custom background image or color, activating the feature in WordPress 3.0 is as simple as including one line of code in your functions.php file. If you want to have a default background image or color, it takes a bit more fiddling [...]"/> <meta property="og:type" content="article"/> <meta property="og:image" content="https://web.archive.org/web/20110104224328im_/http://bavotasan.com/wp-content/uploads/2010/11/bgpattern.jpg"/> </head> <body class="single single-post postid-3005"> <div id="bodywrap">  <script type="text/javascript"> (function(){ var bsa = document.createElement('script'); bsa.type = 'text/javascript'; bsa.async = true; bsa.src = '//web.archive.org/web/20110104224328/http://s3.buysellads.com/ac/bsa.js'; (document.getElementsByTagName('head')[0]||document.getElementsByTagName('body')[0]).appendChild(bsa); })(); </script>   <div id="header"> <div id="topmenu" class="menu-top-menu-container"><ul id="menu-top-menu" class="menu"><li id="menu-item-2254" class="menu-item menu-item-type-custom menu-item-2254"><a href="https://web.archive.org/web/20110104224328/http://themes.bavotasan.com/">Themes by bavotasan.com</a></li> <li id="menu-item-2255" class="menu-item menu-item-type-custom menu-item-2255"><a href="https://web.archive.org/web/20110104224328/http://themes.bavotasan.com/support/">Support Forum</a></li> <li id="menu-item-2259" class="menu-item menu-item-type-custom menu-item-2259"><a href="https://web.archive.org/web/20110104224328/http://themes.bavotasan.com/affiliates">Affiliates</a></li> <li id="menu-item-2256" class="menu-item menu-item-type-post_type menu-item-2256"><a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/about/">About</a></li> <li id="menu-item-2257" class="menu-item menu-item-type-post_type menu-item-2257"><a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/services/">Services</a></li> <li id="menu-item-2258" class="menu-item menu-item-type-post_type menu-item-2258"><a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/contact/">Contact</a></li> </ul></div> <div id="title"> <a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/"> <img src="https://web.archive.org/web/20110104224328im_/http://bavotasan.com/wp-content/themes/bavotasan-2010/images/bavotasan.png" alt="bavotasan.com" width="400" height="70"/> <span id="desc"></span></a> </div> <div id="follow"> <span></span> <a href="https://web.archive.org/web/20110104224328/http://twitter.com/bavotasan" class="twitter"></a> <a href="https://web.archive.org/web/20110104224328/http://feeds.feedburner.com/bavotasan" class="rss"></a> </div> <div id="navigation" class="menu-main-menu-container"> <ul id="menu-main-menu" class="menu"> <li id="menu-item-2264"><a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/"><span></span>Home</a></li> <li id="menu-item-2266"><a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/category/articles/"><span></span>Articles</a></li> <li id="menu-item-2265" class="current-menu-item"><a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/category/tutorials/"><span></span>Tutorials</a></li> <li id="menu-item-2267"><a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/category/downloads/"><span></span>Downloads</a></li> </ul> </div> </div>  <div id="mainwrapper"> <div id="leftcontent"> <div class="posttop"> <div class="thedate"><div class="month">Nov</div><div class="day">30</div><div class="year">2010</div></div> <h1>How to Set a Default Custom Background in WordPress 3.0</h1> <br class="clear"/> <p><img src="https://web.archive.org/web/20110104224328im_/http://bavotasan.com/wp-content/uploads/2010/11/bgpattern.jpg" alt="" title="bgpattern" width="200" height="150" class="alignright size-full wp-image-3007"/>If you’re a theme developer and you want to allow users to set a custom background image or color, activating the feature in WordPress 3.0 is as simple as including one line of code in your <code>functions.php</code> file. If you want to have a default background image or color, it takes a bit more fiddling around to figure out exactly how to make it work. </p> <p>I was able to get it working in a couple of my themes so I thought I would share my findings.</p> <p>Setting up your theme just to use the custom background editor requires this in your <code>functions.php</code>:</p> <div class="wp_syntax"><table border="0" cellpadding="0" cellspacing="0"><tr><td><div class="code"><pre class="php" style="font-family:monospace;"><span style="color: #b1b100;">if</span><span style="color: #009900;">(</span><span style="color: #990000;">function_exists</span><span style="color: #009900;">(</span><span style="color: #0000ff;">'add_custom_background'</span><span style="color: #009900;">)</span><span style="color: #009900;">)</span> <span style="color: #009900;">{</span> add_custom_background<span style="color: #009900;">(</span><span style="color: #0000ff;">'set_theme_background'</span><span style="color: #009900;">)</span><span style="color: #339933;">;</span> <span style="color: #009900;">}</span></pre></div></td></tr></table></div> <p>I like to use the if statement just in case people will be using your theme in an older version of WordPress. Without the if statement, the theme will break. Always think about backwards compatibility if that is important to your theme or to you.</p> <p>Now, to set a default background, it takes a few more steps. Take a look at the code below:</p> <div class="wp_syntax"><table border="0" cellpadding="0" cellspacing="0"><tr><td><div class="code"><pre class="php" style="font-family:monospace;"><span style="color: #b1b100;">if</span><span style="color: #009900;">(</span><span style="color: #990000;">function_exists</span><span style="color: #009900;">(</span><span style="color: #0000ff;">'add_custom_background'</span><span style="color: #009900;">)</span><span style="color: #009900;">)</span> <span style="color: #009900;">{</span> add_custom_background<span style="color: #009900;">(</span><span style="color: #0000ff;">'set_theme_background'</span><span style="color: #009900;">)</span><span style="color: #339933;">;</span>   <span style="color: #000000; font-weight: bold;">function</span> set_theme_background<span style="color: #009900;">(</span><span style="color: #009900;">)</span> <span style="color: #009900;">{</span> <span style="color: #000088;">$bgimage</span> <span style="color: #339933;">=</span> get_background_image<span style="color: #009900;">(</span><span style="color: #009900;">)</span><span style="color: #339933;">;</span> <span style="color: #000088;">$bgcolor</span> <span style="color: #339933;">=</span> get_background_color<span style="color: #009900;">(</span><span style="color: #009900;">)</span><span style="color: #339933;">;</span>   <span style="color: #b1b100;">echo</span> <span style="color: #0000ff;">"<style type='text/css'><span style="color: #000099; font-weight: bold;">\n</span>"</span><span style="color: #339933;">;</span>   <span style="color: #b1b100;">if</span><span style="color: #009900;">(</span><span style="color: #339933;">!</span><span style="color: #990000;">empty</span><span style="color: #009900;">(</span><span style="color: #000088;">$bgimage</span><span style="color: #009900;">)</span><span style="color: #009900;">)</span> <span style="color: #009900;">{</span> <span style="color: #000088;">$background_styles</span> <span style="color: #339933;">=</span> <span style="color: #0000ff;">'background-image: url(\''</span> <span style="color: #339933;">.</span> get_theme_mod<span style="color: #009900;">(</span><span style="color: #0000ff;">'background_image'</span><span style="color: #339933;">,</span> <span style="color: #0000ff;">''</span><span style="color: #009900;">)</span> <span style="color: #339933;">.</span> <span style="color: #0000ff;">'\');'</span> <span style="color: #339933;">.</span> <span style="color: #0000ff;">' background-repeat: '</span> <span style="color: #339933;">.</span> get_theme_mod<span style="color: #009900;">(</span><span style="color: #0000ff;">'background_repeat'</span><span style="color: #339933;">,</span> <span style="color: #0000ff;">'repeat'</span><span style="color: #009900;">)</span> <span style="color: #339933;">.</span> <span style="color: #0000ff;">';'</span> <span style="color: #339933;">.</span> <span style="color: #0000ff;">' background-position: top '</span> <span style="color: #339933;">.</span> get_theme_mod<span style="color: #009900;">(</span><span style="color: #0000ff;">'background_position_x'</span><span style="color: #339933;">,</span> <span style="color: #0000ff;">'left'</span><span style="color: #009900;">)</span> <span style="color: #339933;">.</span> <span style="color: #0000ff;">';'</span> <span style="color: #339933;">.</span> <span style="color: #0000ff;">'background-attachment: '</span><span style="color: #339933;">.</span> get_theme_mod<span style="color: #009900;">(</span><span style="color: #0000ff;">'background_attachment'</span><span style="color: #339933;">,</span> <span style="color: #0000ff;">'scroll'</span><span style="color: #009900;">)</span><span style="color: #339933;">;</span> <span style="color: #b1b100;">echo</span> <span style="color: #0000ff;">"body { "</span><span style="color: #339933;">.</span><span style="color: #000088;">$background_styles</span><span style="color: #339933;">.</span><span style="color: #0000ff;">"); } <span style="color: #000099; font-weight: bold;">\n</span>"</span><span style="color: #339933;">;</span> <span style="color: #009900;">}</span> <span style="color: #b1b100;">if</span><span style="color: #009900;">(</span><span style="color: #339933;">!</span><span style="color: #990000;">empty</span><span style="color: #009900;">(</span><span style="color: #000088;">$bgcolor</span><span style="color: #009900;">)</span><span style="color: #009900;">)</span> <span style="color: #009900;">{</span> <span style="color: #b1b100;">echo</span> <span style="color: #0000ff;">"body { background-color: #"</span><span style="color: #339933;">.</span><span style="color: #000088;">$bgcolor</span><span style="color: #339933;">.</span><span style="color: #0000ff;">"; }; <span style="color: #000099; font-weight: bold;">\n</span>"</span><span style="color: #339933;">;</span> <span style="color: #009900;">}</span> <span style="color: #b1b100;">if</span><span style="color: #009900;">(</span><span style="color: #990000;">empty</span><span style="color: #009900;">(</span><span style="color: #000088;">$bgimage</span><span style="color: #009900;">)</span> <span style="color: #339933;">&&</span> <span style="color: #990000;">empty</span><span style="color: #009900;">(</span><span style="color: #000088;">$bgcolor</span><span style="color: #009900;">)</span><span style="color: #009900;">)</span> <span style="color: #009900;">{</span> <span style="color: #b1b100;">echo</span> <span style="color: #0000ff;">"body { background: url("</span><span style="color: #339933;">.</span>THEME_URL<span style="color: #339933;">.</span><span style="color: #0000ff;">"/images/bg.jpg); }<span style="color: #000099; font-weight: bold;">\n</span>"</span><span style="color: #339933;">;</span> <span style="color: #009900;">}</span> <span style="color: #b1b100;">echo</span> <span style="color: #0000ff;">"</style>"</span><span style="color: #339933;">;</span> <span style="color: #009900;">}</span> <span style="color: #009900;">}</span></pre></div></td></tr></table></div> <p>This seems a bit sloppy but there are no real functions to gather some of this information so I had to string a lot of things together. What this script is doing, is gathering all the information that could be added by the custom background editor if your user is adding an image or a color. If neither is set, then you can set the default.</p> <p>My default is an background image called <code>bg.jpg</code> that I have stored in my theme’s <code>/images</code> folder. You can also just set a color, or a large image with no reapeat. It’s totally up to you.</p> <div class="buttonbox"> </div> </div> <div class="post"> <div class="socialleft">If you liked this, please share it.</div> <ul class="addtoany_list"> <li><a href="https://web.archive.org/web/20110104224328/http://twitter.com/share?url=http%3A%2F%2Fbit.ly%2FhhXLV4&counturl=http://bavotasan.com/tutorials/default-custom-background-wordpress-3/" class="twitter-share-button" data-count="vertical" data-via="bavotasan">Tweet</a><script type="text/javascript" src="https://web.archive.org/web/20110104224328js_/http://platform.twitter.com/widgets.js"></script></li> <li><a href="https://web.archive.org/web/20110104224328/http://www.facebook.com/sharer.php?u=http://bavotasan.com/tutorials/default-custom-background-wordpress-3/&t=How to Set a Default Custom Background in WordPress 3.0" title="Click to send this page to Facebook!" target="_blank" rel="nofollow" class="facebook-icon"></a></li> <li><a href="https://web.archive.org/web/20110104224328/http://digg.com/submit?phase=2&url=http://bavotasan.com/tutorials/default-custom-background-wordpress-3/&title=How to Set a Default Custom Background in WordPress 3.0&bodytext=If you鈥檙e a theme developer and you want to allow users to set a custom background image or color, activating the feature in WordPress 3.0 is as simple as including one line of code in your functions.php file. If you want to have a default background image or color, it takes a bit more fiddling [...]" title="Digg" rel="nofollow" target="_blank" class="digg-icon"></a></li> <li><a href="https://web.archive.org/web/20110104224328/http://www.delicious.com/save" onclick="window.open('https://web.archive.org/web/20110104224328/http://www.delicious.com/save?v=5&noui&jump=close&url='+encodeURIComponent('https://web.archive.org/web/20110104224328/http://bavotasan.com/tutorials/default-custom-background-wordpress-3/')+'&title='+encodeURIComponent('How to Set a Default Custom Background in WordPress 3.0'),'delicious', 'toolbar=no,width=550,height=550'); return false;" class="delicious-icon"></a></li> <li><a href="https://web.archive.org/web/20110104224328/http://www.stumbleupon.com/submit?url=http://bavotasan.com/tutorials/default-custom-background-wordpress-3/&title=How to Set a Default Custom Background in WordPress 3.0" title="StumbleUpon" rel="nofollow" target="_blank" class="stumbleupon-icon"></a></li> <li><iframe src="https://web.archive.org/web/20110104224328if_/http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fbavotasan.com%2Ftutorials%2Fdefault-custom-background-wordpress-3%2F&layout=button_count&show_faces=false&width=100&action=like&colorscheme=light&height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:100px; height:21px;" allowtransparency="true"></iframe></li> </ul> </div> <div class="post"> <p class="tags">Tags: <a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/tag/background/" rel="tag">Background</a>, <a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/tag/background-color/" rel="tag">background color</a>, <a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/tag/background-image/" rel="tag">background image</a>, <a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/tag/bg/" rel="tag">bg</a>, <a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/tag/custom-background-editor/" rel="tag">custom background editor</a>, <a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/tag/functionsphp/" rel="tag">functions.php</a>, <a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/tag/wordpress-3/" rel="tag">wordpress 3</a></p> <p class="tags">Short URL: <a href="https://web.archive.org/web/20110104224328/http://bit.ly/hhXLV4" title="How to Set a Default Custom Background in WordPress 3.0">http://bit.ly/hhXLV4</a></p> </div> <div class="post"> <div id="crp_related"> <h3>Similar Posts</h3> <ul> <li><a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/tutorials/developing-themes-for-wordpress-options/" rel="bookmark" title="Permanent Link to Developing Themes for WordPress: Part 4">Developing Themes for WordPress: Part 4</a></li> <li><a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/tutorials/create-bit-ly-short-urls-for-your-posts-in-wordpress/" rel="bookmark" title="Permanent Link to Create bit.ly Short URLs for your Posts in WordPress">Create bit.ly Short URLs for your Posts in WordPress</a></li> <li><a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/downloads/magazine-basic-free-wordpress-theme/" rel="bookmark" title="Permanent Link to Magazine Basic v2.6 WordPress Theme">Magazine Basic v2.6 WordPress Theme</a></li> <li><a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/tutorials/wordpress-3-activating-background-editor/" rel="bookmark" title="Permanent Link to WordPress 3.0: Activating the Background Editor">WordPress 3.0: Activating the Background Editor</a></li> <li><a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/tutorials/creating-shadows-css3/" rel="bookmark" title="Permanent Link to Creating Shadows with CSS3">Creating Shadows with CSS3</a></li> </ul> </div> <a href="https://web.archive.org/web/20110104224328/http://www.netfirms.com/web-hosting/web-hosting-business/?a_aid=4c8bb52b19602&a_bid=8f049e07" target="_top" style="float:right;"><img src="https://web.archive.org/web/20110104224328im_/http://www.webhostrevenue.com/accounts/default1/banners/300x250-us.gif" alt="Netfirms Business Hosting Plan" title="Netfirms Business Hosting Plan" width="250" height="208"/></a><img style="border:0" src="https://web.archive.org/web/20110104224328im_/http://www.webhostrevenue.com/scripts/imp.php?a_aid=4c8bb52b19602&a_bid=8f049e07" width="1" height="1" alt=""/> </div> <div class="post"> <a href="#comment_list"></a> <div id="comments"> <h3 id="comments-title">Discussion <small> 1 Comment</small> </h3> <ol class="commentlist"> <li class="comment even thread-even depth-1" id="li-comment-22406"> <div id="comment-22406"> <div class="comment-avatar"> <img alt="" src="https://web.archive.org/web/20110104224328im_/http://1.gravatar.com/avatar/12d87eff743075d40ad8957bdca366e9?s=60&d=http%3A%2F%2F1.gravatar.com%2Favatar%2Fad516503a11cd5ca435acc9bb6523536%3Fs%3D60&r=G" class="avatar avatar-60 photo" height="60" width="60"/> </div> <div class="comment-author"> <span class="authorname"><a href="https://web.archive.org/web/20110104224328/http://www.gouri.info/" rel="external " class="url">Gouri</a></span> <span class="commentdate"> on January 4, 2011 at 6:57 am</span> </div> <div class="comment-text"> <p>That’s cool..</p> </div> <div class="reply"> <a rel="nofollow" class="comment-reply-link" href="/web/20110104224328/http://bavotasan.com/tutorials/default-custom-background-wordpress-3/?replytocom=22406#respond" onclick="return addComment.moveForm("comment-22406", "22406", "respond", "3005")">Reply</a> </div> </div> </li> </ol> <a name="respond"></a> <div id="respond"> <h3 id="reply-title">Leave a Reply <small><a rel="nofollow" id="cancel-comment-reply-link" href="/web/20110104224328/http://bavotasan.com/tutorials/default-custom-background-wordpress-3/#respond" style="display:none;">Cancel reply</a></small></h3> <form action="https://web.archive.org/web/20110104224328/http://bavotasan.com/wp-comments-post.php" method="post" id="commentform"> <p class="comment-notes">Your email address will not be published. Required fields are marked <span class="required">*</span></p> <p class="comment-form-author"><label for="author">Name</label> <span class="required">*</span><br/><input id="author" name="author" type="text" value="" size="30"/></p> <p class="comment-form-email"><label for="email">Email</label> <span class="required">*</span><br/><input id="email" name="email" type="text" value="" size="30"/></p> <p class="comment-form-url"><label for="url">Website</label><br/><input id="url" name="url" type="text" value="" size="30"/></p> <p>To enter code in the comment box, please place it between <strong><pre lang="php"> </pre></strong> tags. You don't have to convert any characters to their hex/HTML code. Just add your code the way you would to any code editor.</p> <p class="comment-form-comment"><textarea id="comment" name="comment" cols="45" rows="8" aria-required="true"></textarea></p> <p class="form-submit"> <input name="submit" type="submit" id="submit" value="Post Comment"/> <input type="hidden" name="comment_post_ID" value="3005" id="comment_post_ID"/> <input type="hidden" name="comment_parent" id="comment_parent" value="0"/> </p> <p style="display: none;"><input type="hidden" id="akismet_comment_nonce" name="akismet_comment_nonce" value="4369630fa8"/></p> </form> </div> </div> </div> </div>  <div id="sidebar"> <div id="search"> <form method="get" id="searchform" action="https://web.archive.org/web/20110104224328/http://bavotasan.com/"> <div> <input type="text" class="search_input" value="Search" name="s" id="s" onfocus="if (this.value == 'Search') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Search';}"/> <input type="hidden" id="searchsubmit" value="Search"/> </div> </form> <div class="arrow"></div> </div> <div id="sideads">  <div id="bsap_1237633" class="bsarocks bsap_8982c17d635c33dbe23a7ef930777c37"></div>  <br class="clear"/>  <div id="bsap_1237624" class="bsarocks bsap_8982c17d635c33dbe23a7ef930777c37"></div>  </div> <br class="clear"/> <div class="line"></div> <div class="side-widget" id="mc_side"> <h4>Join Our Mailing List</h4>    <script type="text/javascript" src="https://web.archive.org/web/20110104224328js_/http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script> <script type="text/javascript" src="https://web.archive.org/web/20110104224328js_/http://downloads.mailchimp.com/js/jquery.validate.js"></script> <script type="text/javascript" src="https://web.archive.org/web/20110104224328js_/http://downloads.mailchimp.com/js/jquery.form.js"></script> <div id="mce-responses" style="float: left;top: -1.4em;padding: 0;overflow: hidden;width: 100%;margin: 0;clear: both;"> <div class="response" id="mce-error-response" style="display: none;float: left;z-index: 1;color: #D12F19;"></div> <div class="response" id="mce-success-response" style="display: none;float: left;z-index: 1;color: #529214;"></div> </div> <a href="https://web.archive.org/web/20110104224328/http://eepurl.com/bClm5" id="mailchimp"></a> <div id="mc_embed_signup"> <form action="https://web.archive.org/web/20110104224328/http://bavotasan.us2.list-manage.com/subscribe/post?u=4736f86b6516d6ef4fcc85cdf&id=9b622f388f" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" style="font: normal 100% Arial, sans-serif;font-size: 10px;"> <fieldset style="border: 0;margin: 0;text-align: left;"> <div class="mc-field-group" style="margin: 0 0 1.3em 0;clear: both;overflow: hidden;"> <label for="mce-EMAIL" style="display: block;margin: .3em 0;line-height: 1em;">Email Address </label> <input type="text" value="" name="EMAIL" class="required email" id="mce-EMAIL" style="padding: .2em .3em;width: 100%;float: left;z-index: 999;"> </div> <div><input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="btn" style="clear: both;width: auto;display: block;margin: 0; float: right;"></div> </fieldset> <a href="#" id="mc_embed_close" class="mc_embed_close" style="display: none;">Close</a> </form> </div> <script type="text/javascript"> var fnames = new Array();var ftypes = new Array();fnames[0]='EMAIL';ftypes[0]='email';fnames[1]='FNAME';ftypes[1]='text';fnames[2]='LNAME';ftypes[2]='text';var err_style = ''; try{ err_style = mc_custom_error_style; } catch(e){ err_style = 'margin: 0; padding: 1em 0 0; background: FFEEEE none repeat scroll 0% 0%; font-weight: bold; float: left; z-index: 1; width: 100%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial; color: FF0000;'; } var mce_jQuery = jQuery.noConflict(); mce_jQuery(document).ready( function($) { var options = { errorClass: 'mce_inline_error', errorElement: 'div', errorStyle: err_style, onkeyup: function(){}, onfocusout:function(){}, onblur:function(){} }; var mce_validator = mce_jQuery("#mc-embedded-subscribe-form").validate(options); options = { url: 'https://web.archive.org/web/20110104224328/http://bavotasan.us2.list-manage.com/subscribe/post-json?u=4736f86b6516d6ef4fcc85cdf&id=9b622f388f&c=?', type: 'GET', dataType: 'json', contentType: "application/json; charset=utf-8", beforeSubmit: function(){ mce_jQuery('#mce_tmp_error_msg').remove(); mce_jQuery('.datefield','#mc_embed_signup').each( function(){ var txt = 'filled'; var fields = new Array(); var i = 0; mce_jQuery(':text', this).each( function(){ fields[i] = this; i++; }); mce_jQuery(':hidden', this).each( function(){ if ( fields[0].value=='MM' && fields[1].value=='DD' && fields[2].value=='YYYY' ){ this.value = ''; } else if ( fields[0].value=='' && fields[1].value=='' && fields[2].value=='' ){ this.value = ''; } else { this.value = fields[0].value+'/'+fields[1].value+'/'+fields[2].value; } }); }); return mce_validator.form(); }, success: mce_success_cb }; mce_jQuery('#mc-embedded-subscribe-form').ajaxForm(options); }); function mce_success_cb(resp){ mce_jQuery('#mce-success-response').hide(); mce_jQuery('#mce-error-response').hide(); if (resp.result=="success"){ mce_jQuery('#mce-'+resp.result+'-response').show(); mce_jQuery('#mce-'+resp.result+'-response').html(resp.msg); mce_jQuery('#mc-embedded-subscribe-form').each(function(){ this.reset(); }); } else { var index = -1; var msg; try { var parts = resp.msg.split(' - ',2); if (parts[1]==undefined){ msg = resp.msg; } else { i = parseInt(parts[0]); if (i.toString() == parts[0]){ index = parts[0]; msg = parts[1]; } else { index = -1; msg = resp.msg; } } } catch(e){ index = -1; msg = resp.msg; } try{ if (index== -1){ mce_jQuery('#mce-'+resp.result+'-response').show(); mce_jQuery('#mce-'+resp.result+'-response').html(msg); } else { err_id = 'mce_tmp_error_msg'; html = '<div id="'+err_id+'" style="'+err_style+'"> '+msg+'</div>'; var input_id = '#mc_embed_signup'; var f = mce_jQuery(input_id); if (ftypes[index]=='address'){ input_id = '#mce-'+fnames[index]+'-addr1'; f = mce_jQuery(input_id).parent().parent().get(0); } else if (ftypes[index]=='date'){ input_id = '#mce-'+fnames[index]+'-month'; f = mce_jQuery(input_id).parent().parent().get(0); } else { input_id = '#mce-'+fnames[index]; f = mce_jQuery().parent(input_id).get(0); } if (f){ mce_jQuery(f).append(html); mce_jQuery(input_id).focus(); } else { mce_jQuery('#mce-'+resp.result+'-response').show(); mce_jQuery('#mce-'+resp.result+'-response').html(msg); } } } catch(e){ mce_jQuery('#mce-'+resp.result+'-response').show(); mce_jQuery('#mce-'+resp.result+'-response').html(msg); } } } </script>  </div> <div class="side-widget"> <h4>Most Popular Posts</h4> <ul class="wppp_list"> <li><a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/tutorials/creating-a-jquery-mouseover-fade-effect/" title="Creating a Mouseover Fade Effect with jQuery ">Creating a Mouseover Fade Effect with jQuery </a></li> <li><a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/downloads/full-sizebackground-image-jquery-plugin/" title="Full Size Background Image jQuery Plugin">Full Size Background Image jQuery Plugin</a></li> <li><a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/tutorials/a-simple-mouseover-hover-effect-with-jquery/" title="A Simple Mouseover Hover Effect with jQuery">A Simple Mouseover Hover Effect with jQuery</a></li> <li><a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/downloads/magazine-basic-free-wordpress-theme/" title="Magazine Basic v2.6 WordPress Theme">Magazine Basic v2.6 WordPress Theme</a></li> <li><a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/tutorials/processing-multiple-forms-on-one-page-with-php/" title="Processing Multiple Forms on One Page with PHP">Processing Multiple Forms on One Page with PHP</a></li> <li><a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/tutorials/how-to-create-a-twitter-feed-on-your-web-site/" title="How to Create a Twitter Feed on Your Web Site">How to Create a Twitter Feed on Your Web Site</a></li> <li><a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/tutorials/limiting-the-number-of-words-in-your-excerpt-or-content-in-wordpress/" title="Excerpt or Content Word Limit in WordPress: Redux">Excerpt or Content Word Limit in WordPress: Redux</a></li> <li><a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/tutorials/retrieve-the-first-image-from-a-wordpress-post/" title="Retrieve and Display Images from a WordPress Post">Retrieve and Display Images from a WordPress Post</a></li> <li><a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/tutorials/turn-text-into-an-image-using-the-php-gd-library/" title="Turn Text into an Image using the PHP GD Library">Turn Text into an Image using the PHP GD Library</a></li> <li><a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/tutorials/how-to-modify-your-wordpress-title-tag-for-search-engine-optimization/" title="How to Modify Your WordPress <title> Tag for Search Engine Optimization">How to Modify Your WordPress <title> Tag for Search Engine Optimization</a></li> </ul> </div> <div id="affiliates-ads"> <a href="https://web.archive.org/web/20110104224328/http://themes.bavotasan.com/" class="themes"></a> <a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/downloads/delete-duplicate-posts-pro-wordpress-plugin/" class="deletedupes"></a> <a href="https://web.archive.org/web/20110104224328/https://secure1.inmotionhosting.com/cgi-bin/gby/clickthru.cgi?id=tinkerpriest&page=7" class="inmotion"></a> </div> <div class="line"></div> <div class="side-widget redlink"> <h4>Get a Premium Theme for FREE</h4> <p><a href="https://web.archive.org/web/20110104224328/https://secure1.inmotionhosting.com/cgi-bin/gby/clickthru.cgi?id=tinkerpriest" class="wordpress-logo"></a>Don't have a Web site? How would you like to have WordPress and a <a href="https://web.archive.org/web/20110104224328/http://themes.bavotasan.com/category/premium-themes">Themes by bavotasan.com</a> Premium theme installed and configured for <em>FREE</em>? All you need to do is <a href="https://web.archive.org/web/20110104224328/https://secure1.inmotionhosting.com/cgi-bin/gby/clickthru.cgi?id=tinkerpriest">sign up with InMotion Hosting through this link</a>. <br/> <br/> <a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/free-premium-theme/" class="fr"><em>Click here for more information »</em></a> </p> </div> <div class="side-widget"> <h4>Support c.bavota</h4> <p>If you would like to support <a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/">c.bavota</a> and <a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/">bavotasan.com</a>, please use the donate link below. Any amount, even $1.00, is appreciated (a man's gotta eat, ya know).</p> <a href="https://web.archive.org/web/20110104224328/https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=5745952" id="donate" class="fr">Donate</a> </div> </div> </div> </div>  <div class="whiteline"></div> <div id="footer"> <div id="bottombar"> <a href="javascript:void(0)" class="backtotop">Back to Top<span></span></a> <div class="col col1"> <h4 class="one"><span></span>Stay in Touch</h4> <a href="https://web.archive.org/web/20110104224328/http://twitter.com/bavotasan" class="footer-twitter"><span></span>Follow me on Twitter</a><br/> <a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/feed/" class="footer-rss"><span></span>Subscribe to my RSS Feed</a> <br class="clear"/> <h4 class="two"><span></span>Stay in Tune</h4> <div class="tweets"></div> </div> <div class="col col2"> <h4 class="three"><span></span>Downloads</h4> <ul> <li><a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/downloads/my-first-vanilla-plugin/">My First Vanilla Plugin</a></li> <li><a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/downloads/delete-duplicate-posts-pro-wordpress-plugin/">Delete Duplicate Posts Pro WordPress Plugin</a></li> <li><a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/downloads/feed-me-seymour-free-wordpress-theme/">Feed Me, Seymour 1.2</a></li> <li><a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/downloads/magazine-basic-free-wordpress-theme/">Magazine Basic v2.6 WordPress Theme</a></li> <li><a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/downloads/sliderota-jquery-plugin/">Sliderota jQuery Plugin</a></li> <li><a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/downloads/full-sizebackground-image-jquery-plugin/">Full Size Background Image jQuery Plugin</a></li> <li><a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/downloads/easy-overlay-modal-window-jquery-plugin/">Easy Overlay Modal Window jQuery Plugin</a></li> <li><a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/downloads/snowblind-free-wordpress-theme/">Snowblind Free WordPress Theme</a></li> <li><a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/downloads/8-free-colorful-background-textures-for-designers/">8 Free Colorful Background Textures for Designers</a></li> <li><a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/downloads/stationery-premium-wordpress-theme/">Stationery Premium WordPress Theme</a></li> </ul> </div> <div class="col col3"> <h4 class="four"><span></span>Tutorials</h4> <ul> <li><a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/tutorials/creating-a-sticky-footer-for-your-site/">Creating a Sticky Footer for your Site</a></li> <li><a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/tutorials/simple-text-shadow-effect-using-css3/">Simple Text Shadow Effect using CSS3</a></li> <li><a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/tutorials/default-custom-background-wordpress-3/">How to Set a Default Custom Background in WordPress 3.0</a></li> <li><a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/tutorials/add-a-copyright-notice-to-copied-text/">Add a Copyright Notice to Copied Text</a></li> <li><a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/tutorials/meta-descriptions-wordpress/">Meta Descriptions for WordPress</a></li> <li><a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/tutorials/turning-on-php-errors/">Turning On PHP Errors</a></li> <li><a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/tutorials/using-css-resets/">Using CSS Resets</a></li> <li><a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/tutorials/a-sleek-navigation-menu-with-css3/">A Sleek Navigation Menu with CSS3</a></li> <li><a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/tutorials/a-basic-jquery-slideshow/">A Basic jQuery Slideshow</a></li> <li><a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/tutorials/text-rotation-css3/">Text Rotation with CSS3</a></li> </ul> </div> </div> </div> <div id="copyright"> <div id="copyright-wrapper"> Copyright © 2011 <a href="https://web.archive.org/web/20110104224328/http://bavotasan.com/">bavotasan.com</a>. All Rights Reserved. Powered by <a href="https://web.archive.org/web/20110104224328/http://www.wordpress.org/">WordPress</a>. </div> </div> <script src="https://web.archive.org/web/20110104224328js_/http://stats.wordpress.com/e-201101.js" type="text/javascript"></script> <script type="text/javascript"> st_go({blog:'5317602',v:'ext',post:'3005'}); var load_cmc = function(){linktracker_init(5317602,3005,2);}; if ( typeof addLoadEvent != 'undefined' ) addLoadEvent(load_cmc); else load_cmc(); </script> <script type="text/javascript" src="https://web.archive.org/web/20110104224328js_/http://bavotasan.com/wp-content/themes/bavotasan-2010/js/coolstuff.js"></script> <script type="text/javascript"> hs.graphicsDir = 'https://web.archive.org/web/20110104224328/http://bavotasan.com/images/graphics/'; hs.outlineType = 'rounded-white'; hs.outlineWhileAnimating = true; hs.showCredits = false; </script>  </body> </html>

CINXE.COM

How to Set a Default Custom Background in WordPress 3.0 | bavotasan.com