coderius/yii2-lightbox2-widget

Yii 2 lightbox2-widget

Lightbox2 widget for Yii2

The Lightbox2 widget is a customized lightbox script based on Lightbox. and This widget used to overlay images on top of the current page., _(*1)

, _(*2)

Installation

The preferred way to install this extension is through composer., _(*3)

Either run, _(*4)

php composer.phar require coderius/yii2-lightbox2-widget "@dev"

or add, _(*5)

"coderius/yii2-lightbox2-widget" : "@dev"

to the require section of your application's composer.json file., _(*6)

Usage

• In view:

use coderius\lightbox2\Lightbox2;

= coderius\lightbox2\Lightbox2::widget([
    'clientOptions' => [
        'resizeDuration' => 200,
        'wrapAround' => true,
        
    ]
]); ?>

<a href="<?= Yii::getAlias("@img-web-blog-posts/1/middle/pic.jpg"); ?>" data-lightbox="roadtrip" data-title="some title" data-alt="some alt">
    <!-- Thumbnail picture -->
    <?= Html::img("@img-web-blog-posts/pic.jpg"); ?>
</a>

<a href="<?= Yii::getAlias("@img-web-blog-posts/10/middle/pic2.jpg"); ?>" data-lightbox="roadtrip">
    <!-- Thumbnail picture -->
    <?= Html::img("@img-web-blog-posts/pic2.jpg"); ?>
</a>

<a href="<?= Yii::getAlias("@img-web-blog-posts/11/middle/pic3.jpg"); ?>" data-lightbox="roadtrip">
    <!-- Thumbnail picture -->
    <?= Html::img("@img-web-blog-posts/pic3.jpg"); ?>
</a>

You need set data-lightbox attribute to link and path to image in href attribute. If you wanna to set group images, then put identic names to data-lightbox attribute for each needed link., _(*7)

*Thumbnail picture, by clicking on which opens the widget is wrapped with a link, _(*8)

Reference to plugin github repository that is used in this widget., _(*9)