是否创建在主题选项中上载多个图像的功能?

时间:2011-01-23 作者:janoChen

我遵循Satoshi Wordpress主题中使用的方法,以便用户将图像上载到页面的某个部分(并添加一些文本)。

现在,代码只允许我上传一幅图像。

我必须创建单独的文件才能存档吗?

(例如custom-slider-1.php、custom-slider-2.php、custom-slider-3.php等)?

还是有一个更简单的选择?

Code:

upload-file.php:

<?php
if (move_uploaded_file($_FILES[\'uploadfile\'][\'tmp_name\'], "images/" . $_FILES["uploadfile"]["name"])) { 
  echo "success"; 
} else {
 echo "error";
}
?>
custom-slider.php (it is called to be placed in a div in *functions.php):*

<?php
 $option_fields[] = $slider_image = THEME_PREFIX . "slider_image";
 $option_fields[] = $slider_image_enabled = THEME_PREFIX . "slider_image_enabled";
 $option_fields[] = $slider_text = THEME_PREFIX . "slider_text";

?>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
 <script type="text/javascript" src="<?php bloginfo(\'template_directory\'); ?>/js/ajaxupload.3.5.js" ></script>
<script type="text/javascript" >
 $(function(){
  var btnUpload=$(\'#slider-upload\');
  var status=$(\'#slider-upload-status\');
  new AjaxUpload(btnUpload, {
   action: \'<?php bloginfo(\'template_directory\'); ?>/upload-file.php\',
   name: \'uploadfile\',
   onSubmit: function(file, ext){
     if (! (ext && /^(jpg|png|jpeg|gif)$/.test(ext))){
                    // extension is not allowed
     status.text(\'Only JPG, PNG or GIF files are allowed\');
     return false;
    }
    status.text(\'Uploading...\');
   },
   onComplete: function(file, response){
    //On completion clear the status
    status.text(\'\');
    //Add uploaded file to list
    if(response==="success"){
     $(\'<li></li>\').appendTo(\'#files\').html(\'<img src="<?php bloginfo(\'template_directory\'); ?>/images/\'+file+\'" alt="" /><br />\'+file).addClass(\'success\');
     $(\'#<?php echo $slider_image; ?>\').val(file);
    } else{
     $(\'<li></li>\').appendTo(\'#files\').text(file).addClass(\'error\');
    }
   }
  });

 });
</script>

<div class="postbox">
    <h3>Slider Customization Options</h3>

    <div class="postbox-content">

     <div class="option-row">
      <p>Choose how you would like to display your slider.</p>
     </div><!--end option-row-->

     <div class="option-row">
      <div class="option-name">
       <label>Use Image For Slider</label>
      </div><!--end option-name-->
      <div class="option-value">
       <input class="checkbox" id="<?php echo $slider_image_enabled; ?>" type="checkbox" name="<?php echo $slider_image_enabled; ?>" value="true"<?php checked(TRUE, (bool) get_option($slider_image_enabled)); ?> />
      </div><!--end option-value-->
     </div><!--end option-row-->

     <div class="option-row">
      <div class="option-name">
       <label>Upload An Image</label>
       <span id="slider-upload-status"></span>
      </div><!--end option-name-->
      <div class="option-value">
       <input class="logo-name" id="<?php echo $slider_image; ?>" type="text" name="<?php echo $slider_image; ?>" value="<?php echo get_option($slider_image); ?>" />
       <input type="button" class="background_pattern_button" id="slider-upload" value="Choose Image" />

      </div><!--end option-value-->
  </div><!--end option-row-->

  <div class="option-row">
      <div class="option-name">
       <label>Slider Text</label>
      </div><!--end option-name-->
      <div class="option-value">
       <input class="input-box" id="<?php echo $slider_text; ?>" type="text" name="<?php echo $slider_text; ?>" value="<?php echo get_option($slider_text) ?>" />
      </div><!--end option-value-->
     </div><!--end option-row-->

  <input type="submit" class="button" value="Save Changes" />

    </div>

</div><!--end postbox-->

front-page.php:

  <div id="slider">
   <img src="<?php bloginfo(\'template_directory\'); ?>/images/<?php echo get_option(THEME_PREFIX . \'slider_image\'); ?>" />
  </div>

1 个回复
SO网友:fuxia

在上循环$_FILES 分别排列和添加每个文件。我手头没有完整的代码示例,只是我的主题选项类的摘录:

/**
 * Saves uploaded files in media library and the corresponding id in option field.
 *
 * @return void
 */
protected function handle_uploads()
{
    if ( ! isset ( $_FILES ) or empty ( $_FILES ) )
    {
        return;
    }

    foreach ( $_FILES as $file_key => $file_arr )
    {
        // Some bogus upload.
        if ( ! isset ( $this->fields[$file_key] )
            or empty ( $file_arr[\'type\'] )
        )
        {
            continue;
        }

        if ( ! $this->is_allowed_mime( $file_key, $file_arr ) )
        {
            set_theme_mod( $file_key . \'_error\', \'wrong mime type\' );
            continue;
        }

        // The file is allowed, no error until now and the type is correct.
        $uploaded_file = wp_handle_upload(
            $file_arr
        ,   array( \'test_form\' => FALSE )
        );

        // error
        if ( isset ( $uploaded_file[\'error\'] ) )
        {
            set_theme_mod( $file_key . \'_error\', $uploaded_file[\'error\'] );
            continue;
        }

        // add the file to the media library

        // Set up options array to add this file as an attachment
        $attachment = array(
            \'post_mime_type\' => $uploaded_file[\'type\']
        ,   \'post_title\'     => $this->get_media_name(
                                    $file_key, $uploaded_file[\'file\']
                                )
        );

        // Adds the file to the media library and generates the thumbnails.
        $attach_id = wp_insert_attachment(
            $attachment
        ,   $uploaded_file[\'file\']
        );

        $this->create_upload_meta( $attach_id, $uploaded_file[\'file\'] );

        // Update the theme mod.
        set_theme_mod( $file_key, $attach_id );
        remove_theme_mod( $file_key . \'_error\' );
    }
}
handle_uploads() 由调用save_options() 来自同一个班级。is_allowed_mime() 保证只获取所需的文件类型,以及get_media_name() 查找文件的特殊预定义名称(»徽标«、»bg正文«等)。

正如你所见,这并不难。只需使用内置API,而不是upload-file.php. WordPress会比你的普通版更好地处理很多边缘案例move_uploaded_file().

结束

相关推荐

404从wp-Content/Uploads/获取图像时

我在获取图像时获得404状态,http仍然包含该图像。图像显示在浏览器中,但404代码中断了一些应用程序。对wp内容/上载/的调用被重定向到。htaccess:<IfModule mod_rewrite.c> RewriteEngine On RewriteBase / RewriteRule ^index\\.php$ - [L] RewriteRule (.*) /index.php?getfile=$1 [L] </IfModule>&