Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/skeeks-semenov/yii2-widget-nanogallery
Image gallery for jQuery
https://github.com/skeeks-semenov/yii2-widget-nanogallery
nanogallery skeeks skeeks-cms yii yii2
Last synced: about 1 month ago
JSON representation
Image gallery for jQuery
- Host: GitHub
- URL: https://github.com/skeeks-semenov/yii2-widget-nanogallery
- Owner: skeeks-semenov
- License: bsd-3-clause
- Created: 2019-02-06T10:25:52.000Z (almost 6 years ago)
- Default Branch: master
- Last Pushed: 2023-06-05T11:40:03.000Z (over 1 year ago)
- Last Synced: 2024-04-24T13:27:36.417Z (8 months ago)
- Topics: nanogallery, skeeks, skeeks-cms, yii, yii2
- Language: PHP
- Homepage: https://skeeks.com
- Size: 6.55 MB
- Stars: 2
- Watchers: 2
- Forks: 1
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
Image gallery for jQuery
=====================
nanoGALLERY is a touch enabled and fully responsive image gallery with justified, cascading and grid layout.
It supports self hosted images and pulling in Flickr, Google Photos and Google+ photo albums.
[nanogallery.brisbois.fr](http://nanogallery.brisbois.fr/)
[nanoGALLERY github](https://github.com/Kris-B/nanoGALLERY)
[](https://packagist.org/packages/skeeks/yii2-widget-nanogallery)
[](https://packagist.org/packages/skeeks/yii2-widget-nanogallery)
Installation
------------
The preferred way to install this extension is through [composer](http://getcomposer.org/download/).
Either run
```
php composer.phar require --prefer-dist skeeks/yii2-widget-nanogallery "^0.0.1"
```
or add
```
"skeeks/yii2-widget-nanogallery": "^0.0.1"
```
How to use
----------
```php
= \skeeks\yii2\nanogalleryWidget\NanogalleryWidget::widget([
'items' => [
[
'src' => 'https://images.wallpaperscraft.ru/image/leopard_hischnik_morda_oskal_agressiya_58086_1280x720.jpg',
'preview_src' => 'https://images.wallpaperscraft.ru/image/leopard_hischnik_morda_oskal_agressiya_58086_1280x720.jpg',
'title' => 'title',
'description' => 'description',
],
[
'src' => 'https://s1.1zoom.ru/b5050/261/348938-sepik_2048x1152.jpg',
'preview_src' => 'https://s1.1zoom.ru/b5050/261/348938-sepik_2048x1152.jpg',
'title' => 'title',
'description' => 'description',
],
[
'src' => 'https://s1.1zoom.ru/big3/297/Canada_Mountains_Scenery_488936.jpg',
'preview_src' => 'https://s1.1zoom.ru/big3/297/Canada_Mountains_Scenery_488936.jpg',
'title' => 'title',
'description' => 'description',
]
],
'clientOptions' => [
'thumbnailHeight' => 500
//all options see http://nanogallery.brisbois.fr/
],
]); ?>
```
How to use for SkeekS CMS
----------
```php
$tree = \skeeks\cms\models\CmsTree::findOne(10);
$images = $tree->images;
$items = \yii\helpers\ArrayHelper::map($images, "id", function (\skeeks\cms\models\StorageFile $model) {
return [
'src' => $model->src,
'preview_src' => \Yii::$app->imaging->thumbnailUrlOnRequest($model->src,
new \skeeks\cms\components\imaging\filters\Thumbnail([
'h' => 350,
'w' => 0,
])
),
'description' => $model->name,
'title' => $model->name,
];
});
?>
= \skeeks\yii2\nanogalleryWidget\NanogalleryWidget::widget([
'items' => $items,
'clientOptions' => [
'thumbnailHeight' => 200
//all options see http://nanogallery.brisbois.fr/
],
]); ?>
```
[
](https://skeeks.com/uploads/all/9a/e4/a1/9ae4a18a23686f3a1d19004807c82c64.png)
[
](https://skeeks.com/uploads/all/6c/c1/6d/6cc16d8e75a04a52813e59478ef9c048.png)
Video
------------
[
](https://www.youtube.com/watch?v=LXAGrxcmQiE)
Links
----------
* [Github](https://github.com/skeeks-semenov/yii2-widget-nanogallery)
* [Changelog](https://github.com/skeeks-semenov/yii2-widget-nanogallery/blob/master/CHANGELOG.md)
* [Issues](https://github.com/skeeks-semenov/yii2-widget-nanogallery/issues)
* [Packagist](https://packagist.org/packages/skeeks/yii2-widget-nanogallery)
___
> [](https://skeeks.com)
SkeekS CMS (Yii2) — fast, simple, effective!
[skeeks.com](https://skeeks.com) | [cms.skeeks.com](https://cms.skeeks.com)