We are going to deploy the new yiiframework.com website on March 23, 2018 from 8:00 to 12:00 UTC.
Website and Yii documentation will not be available in this time frame. Check the news for more details.

Yii 2.0: yii2-prettyphoto

Yii2 widget for prettyPhoto jQuery lightbox clone

Yii2 widget for prettyPhoto jQuery lightbox clone scaron/prettyphoto




First of all, add extension to your composer.json:

    "require": {
        "nirvana-msu/yii2-prettyphoto": "1.0.*@dev"

Unfortunately, scaron/prettyphoto repository has not been updated in several years and does not contain bower.json which would allow composer to install it.

Instead of copying over the files manually or creating yet another fork just to add bower.json, this extension defines the required repository package inline. Since composer does not inherit "repositories" section, you have to add the same section to your own composer.json:

"repositories": [
            "type": "package",
            "package": {
                "name": "bower-asset/jquery-prettyPhoto",
                "type": "bower-asset-library",
                "version": "3.1.4",
                "source": {
                    "url": "https://github.com/scaron/prettyphoto",
                    "type": "git",
                    "reference": "master"

After this just update your dependencies as usual, e.g. by running composer update

Widget Configuration

  • $target = "a[rel^='prettyPhoto']" string jQuery target selector
  • $pluginOptions = [] array PrettyPhoto plugin options. For more information refer to prettyPhoto documentation

Sample usage

Rendering widget will produce the necessary javascript code to register plugin.

Using default configuration:


Customizing some plugin options:

    'target' => "a[rel^='prettyPhoto']",
    'pluginOptions' => [
        'opacity' => 0.60,
        'theme' => PrettyPhoto::THEME_DARK_SQUARE,
        'social_tools' => false,
        'autoplay_slideshow' => true,
        'modal' => true

To activate plugin, add rel=”prettyPhoto” attribute for single images and rel="prettyPhoto[gallery-name]” for galleries. These attributes must match target selector as configured by $target property. Refer to prettyPhoto documentation for more examples.


Released under GPL-2.0 license, same as underlying prettyPhoto plugin.


14/12/2014 * Simplified widget to just register required javascript code - no extra html markup is created. Widget does not add rel=”prettyPhoto” attribute automatically anymore - you need to specify it manually for the required content.

Be the first person to leave a comment

Please to leave your comment.

Create extension
No downloadable files yet