通过自定义字段给文章添加一些附属图片什么的，应用很广，一般技术不到位的，会使用自定义字段填写图片url来实现，那样虽然实现了，但是非常不方便，我们要的是不经能直接填写图片url，而且能直接上传，并且要能够实时预览。其实理论很简单，跟我们后台教程中添加图片上传功能基本一样，可参考：wordpress主题后台制作(八):图片上传。

OK，我们还是沿用上一篇教程中的代码，并且直接在上一篇教程中添加图片上传功能：

首先打开我们的metabox.php文件，在配置数组中添加一项：

 第二步：在函数new_meta_boxes中的switch语句中添加一项即可，其实我们直接将后台教程中提到的上传代码复制过来即可用：

 第三步：加载js，要知道，如果仅仅加这个代码，虽然你能够调取到上传图片上传的对话框，但是还不能将图片url插入到文本域中，更不能实现实时预览。所以我们需要添加一个js文件，比如我沿用以前的，在twenty ten主题中新建一个js文件夹，在里面加你一个名为metaup.js的js文件，该js文件中的代码为：

第四步：加载js文件，在metabox.php文件的函数中(请注意是在该函数中，不在switch语句的外面,或者你也可以直接放在这个文件中，不放在任何函数里面)添加以下代码：

这样就完成了，效果图：

调用方法请参考上一篇文章。

好了，为了方便懒人使用，将现在的metabox.php中的代码全部贴出，注意现在添加js文件才能使用哦。