Для использования расширения необходимо скачать его. Скачать вы можете с официального сайта Yii Framework: http://www.yiiframework.com/extension/xupload/ или с сайта кодер.укр: скачать.

Распаковываем содержимое архива в папку /protected/extensions переименовываем папку xupload-x.x.x в xupload

Если вы качали плагин с сайта Yii Framework, то при использовании Yii framework v 1.16 и выше вы можете столкнуться со следующей ошибкой:

TypeError: that is undefined
TypeError: that is undefined /assets/bde6a3e7/js/jquery.fileupload-ui.js Line 88
Line 88

TypeError: that is undefined
options = that.options,

Для исправления этой ошибки необходимо открыть файл /protected/extensions/xupload/assets/js/jquery.fileupload-ui.js и заменить строку 88 с 

var that = $(this).data('fileupload'),

на 

var that = $(this).data('blueimpUI-fileupload'),

После чего очистите папку /assets в корне проекта. В архиве с сайта кодер.укр это уже исправлено.

Далее открываем файл /protected/config/main.php для редактирования и добавляем алиас для расширения xupload: 

<?php

return array(
    //...

    'import'=>array(    
        'application.models.*',    
        'application.components.*',
    ),

    'aliases' => array(  
        'xupload' => 'ext.xupload'
    ),

    //...
);

Следующим шагом необходимо переопределить CController::actions() и зарегистрировать действие класса XUploadAction для загрузки и настройки свойств (файл: /protected/controllers/SiteControllers.php):

<?php

class SiteController extends Controller {

    /**
     * Declares class-based actions.
     */
    public function actions() {
        return array(
            // captcha action renders the CAPTCHA image displayed on the contact page
            'captcha' => array(
                'class' => 'CCaptchaAction',
                'backColor' => 0xFFFFFF,
            ),
            // page action renders "static" pages stored under 'protected/views/site/pages'
            // They can be accessed via: index.php?r=site/page&view=FileName
            'page' => array(
                'class' => 'CViewAction',
            ),
            //добавляем действие upload для загрузки файлов
            'upload'=>array(
                'class'=>'xupload.actions.XUploadAction',
                'path' =>Yii::app() -> getBasePath() . "/../uploads",
                'publicPath' => Yii::app() -> getBaseUrl() . "/uploads",
            ),
        );
    }

    //...
}

Где path - путь к папке загрузки файла, publicPath - url к папке загрузки файла.

Создадим действие, в котором будем выводить форму с помощью XUploadModel (файл: /protected/controllers/SiteControllers.php): 

<?php
class SiteController extends Controller {

    //...

    public function actionXUpload() {
        Yii::import("xupload.models.XUploadForm");
        $model = new XUploadForm;
        $this->render('xUpload', array('model' => $model, ));
    }

    //...

}

В файле представления(view) выводим виджет с формой для загрузки файлов (файл: /themes/themeName/views/site/xUpload.php): 

<?php

$this->widget('xupload.XUpload', array(
    'url' => Yii::app()->createUrl("site/upload"),
    'model' => $model,
    'attribute' => 'file',
    'multiple' => true,
));

Все, расширение готово к работе.

Дополнительные настройки XUpload

Разрешим загружать только изображения (png, jpg, jpeg), и установим для них максимальный размер (3 Mb), для этого добавим в настройки виджета параметр options:

'options' => array(
    'maxFileSize' => 3000000,
    'acceptFileTypes' => "js:/(\.|\/)(jpe?g|png)$/i",
)

После чего файл /themes/themeName/views/site/xUpload.php примет вид: 

<?php

$this->widget('xupload.XUpload', array(
    'url' => Yii::app()->createUrl("site/upload"),
    'model' => $model,
    'attribute' => 'file',
    'multiple' => true,
        'options' => array(
            'maxFileSize' => 3000000,
            'acceptFileTypes' => "js:/(\.|\/)(jpe?g|png)$/i",
        )
    )
);

Так же мы можем добавить дроп зону (drop zone effects) для загрузки файлов пример (файл: /themes/themeName/views/site/xUpload.php): 

<?php

$this->widget('xupload.XUpload', array(
    'url' => Yii::app()->createUrl("site/upload"),
    'model' => $model,
    'attribute' => 'file',
    'multiple' => true,
));
?>

<div id="dropzone">Перетащите файл сюда для загрузки</div>

<style>
    #dropzone {
    background: #C6C6C6;
    width: 100%;    
    text-align: center;
    font-weight: bold;
    padding: 50px 0;
}
</style>

Подробную информацию по настройке дроп зоны (drop zone) можно посмотреть здесь: https://github.com/blueimp/jQuery-File-Upload/wiki/Drop-zone-effects

Wiki плагина jQuery-File-Upload здесь: https://github.com/blueimp/jQuery-File-Upload/wiki

Сайт плагина: http://blueimp.github.io/jQuery-File-Upload/