Gallery Manager usage instructions
Yii2 port of https://github.com/zxbodya/yii-gallery-manager, (*1)
(frontend part mostly without changes, but backend was rewritten almost completely), (*2)
warning: preview version, (*3)
Features
- AJAX image upload
- Optional name and description for each image
- Possibility to arrange images in gallery
- Ability to generate few versions for each image with different configurations
- Drag & Drop
Decencies
- Yii2
- Twitter bootstrap assets (version 3)
- Imagine library
- JQuery UI (included with Yii)
Installation:
The preferred way to install this extension is through composer., (*4)
Either run, (*5)
php composer.phar require --prefer-dist zxbodya/yii2-gallery-manager "*@dev"
, (*6)
or add, (*7)
"zxbodya/yii2-gallery-manager": "*@dev"
, (*8)
to the require section of your composer.json
file., (*9)
Usage
Add migration to create table for images:, (*10)
class m150318_154933_gallery_ext
extends zxbodya\yii2\galleryManager\migrations\m140930_003227_gallery_manager
{
}
Or better - copy migration to you application., (*11)
Add GalleryBehavior to your model, and configure it, create folder for uploaded files., (*12)
public function behaviors()
{
return [
'galleryBehavior' => [
'class' => GalleryBehavior::className(),
'type' => 'product',
'extension' => 'jpg',
'directory' => Yii::getAlias('@contentRoot') . '/images/product/gallery',
'url' => Yii::getAlias('@web') . '/images/product/gallery',
'versions' => [
'small' => function ($img) {
/** @var ImageInterface $img */
return $img
->copy()
->thumbnail(new Box(200, 200));
},
'medium' => function ($img) {
/** @var ImageInterface $img */
$dstSize = $img->getSize();
$maxWidth = 800;
if ($dstSize->getWidth() > $maxWidth) {
$dstSize = $dstSize->widen($maxWidth);
}
return $img
->copy()
->resize($dstSize);
},
]
]
];
}
Add GalleryManagerAction in controller somewhere in your application. Also on this step you can add some security checks for this action., (*13)
public function actions()
{
return [
'galleryApi' => [
'class' => GalleryManagerAction::className(),
// mappings between type names and model classes (should be the same as in behaviour)
'types => [
'product' => Product::className()
]
],
];
}
Add ImageAttachmentWidget somewhere in you application, for example in editing from., (*14)
if ($model->isNewRecord) {
echo 'Can not upload images for new record';
} else {
echo GalleryManager::widget(
[
'model' => $model,
'behaviorName' => 'galleryBehavior',
'apiRoute' => 'product/galleryApi'
]
);
}
Done!, (*15)
Now, you can use uploaded images from gallery like following:, (*16)
foreach($model->getBehavior('galleryBehavior')->getImages() as $image) {
echo Html::img($image->getUrl('medium'));
}
Options
Using non default table name for gallery images(default is {{%gallery_image}}
):, (*17)
- Add migration that will create table you need
- Change
tableName
property in behavior configuration