Настройка evoGallery и jQuerry

Modx установлен теперь пришло время организовать загрузку изображений. Рассмотрим установку модуля evoGallery.

Допустим Modx установлен. Качаем последнюю версию http://modx.com/extras/package/evogallery.

1. Копируем содержимое в папку на сервере.
2. Устанавливаем для папки galleries права 0777.
3. Запустить установку site_name/install. Устанавливаем и после установки удаляем папку install
4. Пробуем загрузить несколько изображений через модуль на главную страницу. И сделаем простой вызов сниппета [!evoGallery!].

Все изображения отображаются, однако если попробовать открыть изображение - мы перейдем по ссылке на это изображение в увеличенном виде. Для того, чтобы это немножко окультурить существует масса плагинов на jQuery для открытия всплывающего окна с увеличенным изображением. В своем примере я опишу установку prettyPhoto.

1. Копируем папки css, js, images.
2. Редактируем тег <head>. Подключаем css, js из папок и jquery.min.js. Добавляем скрипт (см. ниже красным цветом).
3. Создаем чанк, который подключим в вызове сниппета  [!evoGallery? &itemTpl=`tpl`!]

Chunk:
<a href="[+images_dir+][+filename+]" rel="prettyPhoto[pp_gal]"><img class="pretty-photo" src="[+thumbs_dir+][+filename+]" alt="[+title+]" /></a>

<script type="text/javascript" src="js/jquery.prettyPhoto.js"></script>
<script type="text/javascript" charset="utf-8">

    $(document).ready(function(){

        $("a[rel^='prettyPhoto']").prettyPhoto();

    });

</script>

И всё должно работать.

---

Какие были у меня косяки при настройке:

• Изображение отображается, однако рамки и границы не отображаются. В этом случае необходимо проверить пути, прописанные в css файле (либо наличие этих изображений в папке на сервере).
• Был установлен shopkeeper и в коде вызывалась дополнительно библиотека jquery.min.js. Мне помогло удаление данной библиотеки. Двойной вызов точно не нужен.
• При обычном запуске [!evoGallery!] не отображалось ничего. Проблема была в регистре. Сработал вызов [!EvoGallery!]