Вывести несколько фотогалерей на одной странице в Yii2

Как организовать фотогалерею через поведение описал ранее - здесь.

Теперь же посмотрим как выводить на одну страницу несколько (неизвестное заранее) количество фотогалерей, правильнее сказать альбомов. Например, у вас портфолио работ, которое будет пополняться новыми проектами.

У меня в каждой записи для примера будет можно задавать 2 галереи - это "Фото" и "Отзывы". Соответственно записей таких может быть много на странице.

В виде _view.php

<div class="row text-center">
                <div class="col-xs-5">
                    <div class="hor">
                        <?php
                        if($photoimages=$model->getBehavior('galleryBehavior')->getImages()) {
                            foreach($photoimages as $r => $im) {
                                if($r == '0') {
                                    if(($model->icon2 != '') && file_exists(Yii::getAlias('@webroot'.$model->icon2))) $icon2 = $model->icon2; else $icon2 = "/images/logo_circle.png";
                                    echo Html::a(Html::img($icon2, ['class'=>'img-responsive']), $im->getUrl('original'), ['rel'=>'port'.$model->id, 'class' => 'album'.$model->id]);
                                }
                                else echo Html::a('', $im->getUrl('original'), ['rel'=>'port'.$model->id, 'class' => 'album'.$model->id, 'style'=>'display:none']); 
                            }
                        } else {
                            echo Html::img('/images/logo_circle.png', ['class'=>'img-responsive']);
                        }
                        ?>
                        <div class="d_l"></div>
                        <div class="d_r"></div>
                    </div>
                    <p class="h5">Фото</p>
                </div>
                
                <?php if($reviewimages=$model->getBehavior('galleryBehavior_reviews')->getImages()) : ?>
                    <div class="col-xs-5 col-xs-offset-1">
                        <div class="hor img-circle">
                            <?php
                                foreach($reviewimages as $r => $im) {
                                    if($r == '0') {
                                        if(($model->icon3 != '') && file_exists(Yii::getAlias('@webroot'.$model->icon3))) $icon3 = $model->icon3; else $icon3 = "/images/logo_circle.png";
                                        echo Html::a(Html::img($icon3, ['class'=>'img-responsive img-circle']), $im->getUrl('original'), ['rel'=>'port'.$model->id, 'class' => 'album'.$model->id]);
                                    }
                                    else echo Html::a('', $im->getUrl('original'), ['rel'=>'port'.$model->id, 'class' => 'album'.$model->id, 'style'=>'display:none']); 
                                }
                            ?>
                            <div class="d_l"></div>
                            <div class="d_r"></div>
                        </div>
                        <p class="h5">Отзывы</p>
                    </div>
                <?php endif;?>
            </div>

Здесь видим две галереи формируются извлечением фоток в массив. Работает это через полюбившееся расширение zxbodya/yii2-gallery-manager. У меня здесь видно это поведения 'galleryBehavior' и 'galleryBehavior_reviews'.

Эти названия были указаны в форме _form.php, вот одно (второе аналогично).

...
<?php 
                                if ($model->isNewRecord) {
                                    echo 'Загрузка изображений будет возможна после создания записи. Сохраните и откройте на редактирование.';
                                } else {
                                    echo GalleryManager::widget(
                                        [
                                            'model' => $model,
                                            'behaviorName' => 'galleryBehavior',
                                            'apiRoute' => 'portfolio/galleryApi'
                                        ]
                                    );
                            }?>
...

Для показа фоток подвесил вручную colorbox без расширения, поэтому в том же виде _view.php в начале файла подключаю динамически скрипт. Это будет подключать для каждой записи скрипт на ссылки со своими 'rel' и классом '.album$model->id'

$script = <<< JS
    jQuery('a.album$model->id').colorbox({ opacity:0.5, rel:'port$model->id', maxWidth:800, maxHeight:600, loop:false });
JS;
//маркер конца строки, обязательно сразу, без пробелов и табуляции
$this->registerJs($script, yii\web\View::POS_END);

Конечно нужен сам colorbox, скачайте с официального сайта и подключить его стили и js в ваш assets/YourAssetsBundle.php

... 
public $css = [
        ...
        'colorbox/example3/colorbox.css',
    ];
    public $cssOptions = [
        'type' => 'text/css'
    ];
    public $js = [
        ...
        'colorbox/jquery.colorbox-min.js',
    ];
...

15 марта 2016, Программирование, веб-кодинг / Метки: gallery фотогалерея