xj/yii2-galleria-widget

yii2-galleria-widget

# yii2-galleria-widget

https://github.com/aino/galleria

### composer.json

"require": {
    "xj/yii2-galleria-widget": "~1.0.0"
},

Themes

\xj\galleria\themes\DefaultAssets::register($this);
\xj\galleria\themes\TwelveAssets::register($this);

BasicAssets

\xj\galleria\GalleriaAssets::register($this);

### With Html Tag

#galleria{ width: 700px; height: 400px; background: #000 }

```html , <sub>(*1)</sub>

```php
\xj\galleria\themes\DefaultAssets::register($this);
xj\galleria\Galleria::widget([
    'selector' => '#galleria',
]);

### With Html Data Tag

#gallery{ width: 700px; height: 400px; background: #000 }
#source{display:none;}

```html , <sub>(*2)</sub>

```php
\xj\galleria\themes\DefaultAssets::register($this);
xj\galleria\Galleria::widget([
    'selector' => '#gallery',
    'jsOptions' => [
        'dataSource' => '#source',
        'keepSource' => false,
    ]
]);

### With Javascript Data

#gallery{ width: 700px; height: 400px; background: #000 }

```html , <sub>(*3)</sub>

```php
\xj\galleria\themes\DefaultAssets::register($this);
xj\galleria\Galleria::widget([
    'selector' => '#gallery',
    'jsOptions' => [
        'dataSource' => [
            ['image' => Yii::getAlias('@web/images/hoverzoom/1.jpg')],
            ['image' => Yii::getAlias('@web/images/hoverzoom/3.jpg')],
            ['image' => Yii::getAlias('@web/images/nivoslider/1.jpg')],
        ],
        'keepSource' => false,
    ]
]);