你是否想像 Nometet.com 这个网站一样让每篇博客文章的背景看起来都不一样呢？这个网站的设计确实是非常酷的，因为它允许作者通过上传图片来自定义文章背景，而且甚至图片的尺寸也没有特别的规定。上传并不困难，只要在 meta 盒里执行一个上传软件就可以了，主要还是在选择图片上，让我们来看看究竟如何实现的呢？
考虑到后面需要用上传软件将图片的 URL 地址保存到一个自定义字段里，所以我们先将自定义字段建好，这样一来你只需要将 URL 收到自定义字段里并将其显示为背景即可，代码非常简单:
| <?php $bg = get_post_custom_values("background"); if ( is_array($bg) ) { ?> <style type="text/css" media="screen"> body{ background: url(<?php echo $bg ?>) fixed no-repeat; } </style> <?php } ?> |
不过你还得修改图片尺寸并将 URL 拷贝到自定义字段里。
自定义 meta 上传软件
我们需要一个上传软件，究竟该如何实现呢？通过对 WooThemes 的研究，我发现他们的主题里有一个 admin-custom.php 文件 （在/functions 目录下），这是他们用来加上传软件以及其他自定义 meta 盒的地方。
你可以从这里下载此文件。
下载完之后，复制所有代码并将其粘贴到你的 functions.php 文件里 （注意要粘贴在结束的?> 标签之后） 。
接着，需要启动 meta 盒，可以用下面的代码来实现：
| $woo_metaboxes = array( "image" => array ( "name" => "bg", "label" => "Background", "type" => "upload", "desc" => "Automatically resized/enlarged but at least 1000px x 800px for it to be big enough." ), ); update_option('woo_custom_template',$woo_metaboxes); |
这段代码必需添加在其他代码之后结束的?> 标签之前。保存并上传文件，这样就你就有了上传软件，它会将图片保存到自定义字段 『bg』 里。
调整图像大小
最后需要使用 timthumb 来调整图像的宽度为 1920 像素，首先下载 TimThumb.php，并将它上传到你的主题 tools 文件里，头部的代码要遵守 timbthumb 的句法：
| body{ background: url(<?php bloginfo('template_url'); ?>/tools/timthumb.php?w=1920&zc=1&src=<?php echo $bg; ?>) fixed no-repeat; } |
你会发现使用上面的代码是行不通的，因为 timthumb 不喜欢自定义字段里的图片 URL 地址 http://… 。
最后别人告诉我需要将 URL 地址编译才行，于是把上面的代码替换成：
| body{ background: url(<?php bloginfo('template_url'); ?>/tools/timthumb.php?w=1920&zc=1&src=<?php echo urlencode($bg); ?>) fixed no-repeat; } |
宣告成功！