Для чего?
Иногда попадаются такие проекты, где необходимо реализовать галерею, но картинок будет много, поэтому нужно что-то универсальное, ну и соответственно чтобы можно было быстро добавить из админки эти самые картинки.
Реализовать это можно с помощью MIGX. Конечно, там будут свои недостатки, но для небольших проектов самое то. В итоге будет это:
- Динамический источник файлов
- Автоматом будет создавать папку для каждого ресурса.
- Возможность загрузки сразу нескольких файлов
- Все загруженные файлы будут автоматом добавлены в качестве элементов MIGX
- При удаление элементов изображения будут удаляться из папки тоже
И так начнем.
Для начала создадим конфигурацию MIGX.
- Переходим в MIGX -> Вкладка MIGX -> Добавить элемент. В поле "Name" впишем "resourcegallery" и нажимаем "Выполнено"
- Затем кликаем правой кнопкой мыши по только что созданной конфигурации "resourcegallery" -> Экспорт/Импорт. И вставляем приведенный ниже код в поле "Json"
{ "formtabs":[ { "MIGX_id":1, "caption":"Image", "print_before_tabs":"0", "fields":[ { "MIGX_id":1, "field":"image", "caption":"Image", "description":"", "description_is_code":"0", "inputTV":"", "inputTVtype":"image", "validation":"", "configs":"", "restrictive_condition":"", "display":"", "sourceFrom":"migx", "sources":"", "inputOptionValues":"", "default":"", "useDefaultIfEmpty":"0", "pos":1 }, { "MIGX_id":2, "field":"title", "caption":"\u0417\u0430\u0433\u043e\u043b\u043e\u0432\u043e\u043a", "description":"", "description_is_code":"0", "inputTV":"", "inputTVtype":"", "validation":"", "configs":"", "restrictive_condition":"", "display":"", "sourceFrom":"config", "sources":"", "inputOptionValues":"", "default":"", "useDefaultIfEmpty":"0", "pos":2 } ], "pos":1 } ], "contextmenus":"edit_migx||duplicate_migx||remove_migx_and_image||movetotop_migx||movetotop_bottom", "actionbuttons":"loadfromsource||uploadfiles", "columnbuttons":"", "filters":"", "extended":{ "migx_add":"Add Image", "disable_add_item":1, "add_items_directly":"", "formcaption":"Image", "update_win_title":"", "win_id":"resourcegallery", "maxRecords":"", "addNewItemAt":"bottom", "multiple_formtabs":"", "multiple_formtabs_label":"", "multiple_formtabs_field":"", "multiple_formtabs_optionstext":"", "multiple_formtabs_optionsvalue":"", "actionbuttonsperrow":4, "winbuttonslist":"", "extrahandlers":"this.handleColumnSwitch", "filtersperrow":4, "packageName":"", "classname":"", "task":"", "getlistsort":"", "getlistsortdir":"", "sortconfig":"", "gridpagesize":"", "use_custom_prefix":"0", "prefix":"", "grid":"", "gridload_mode":1, "check_resid":1, "check_resid_TV":"", "join_alias":"", "has_jointable":"yes", "getlistwhere":"", "joins":"", "hooksnippets":"", "cmpmaincaption":"", "cmptabcaption":"", "cmptabdescription":"", "cmptabcontroller":"", "winbuttons":"", "onsubmitsuccess":"", "submitparams":"" }, "columns":[ { "MIGX_id":1, "header":"ID", "dataIndex":"MIGX_id", "width":10, "sortable":"false", "show_in_grid":"0", "customrenderer":"", "renderer":"", "clickaction":"", "selectorconfig":"", "renderchunktpl":"", "renderoptions":"", "editor":"" }, { "MIGX_id":3, "header":"\u0418\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435", "dataIndex":"image", "width":20, "sortable":"false", "show_in_grid":1, "customrenderer":"", "renderer":"this.renderImage", "clickaction":"", "selectorconfig":"", "renderchunktpl":"", "renderoptions":"", "editor":"" }, { "MIGX_id":2, "header":"\u0417\u0430\u0433\u043e\u043b\u043e\u0432\u043e\u043a", "dataIndex":"title", "width":20, "sortable":"false", "show_in_grid":1, "customrenderer":"", "renderer":"", "clickaction":"", "selectorconfig":"", "renderchunktpl":"", "renderoptions":"", "editor":"this.textEditor" }, { "MIGX_id":4, "header":"\u041e\u043f\u0443\u0431\u043b\u0438\u043a\u043e\u0432\u0430\u043d\u043e", "dataIndex":"published", "width":"", "sortable":"false", "show_in_grid":1, "customrenderer":"", "renderer":"this.renderSwitchStatusOptions", "clickaction":"switchOption", "selectorconfig":"", "renderchunktpl":"", "renderoptions":[ { "MIGX_id":1, "name":"published", "use_as_fallback":1, "value":1, "clickaction":"switchOption", "handler":"", "image":"assets\/components\/migx\/style\/images\/cb_ticked.png" }, { "MIGX_id":2, "name":"published", "use_as_fallback":"", "value":1, "clickaction":"switchOption", "handler":"", "image":"assets\/components\/migx\/style\/images\/cb_ticked.png" }, { "MIGX_id":3, "name":"unpublished", "use_as_fallback":"", "value":"0", "clickaction":"switchOption", "handler":"", "image":"assets\/components\/migx\/style\/images\/cb_empty.png" } ], "editor":"" } ] }
- Теперь нужно создать источник файлов Медиа -> Источники файлов -> Создать новый источник файлов. Имя на ваше усмотрение, например "resources" Тип источника файлов - файловая система. Параметры:
- basePath = [[!migxResourceMediaPath? &pathTpl=`assets/images/res/{id}/` &createFolder=`1` ]]
- basePathRelative = Да
- baseUrl = [[!migxResourceMediaPath? &pathTpl=`assets/images/res/{id}/` &createFolder=`1`]]
- baseUrlRelative = Да
- allowedFileTypes = у меня пусто
- imageExtensions = jpg,jpeg,png,gif
- thumbnailType = PNG
- thumbnailQuality = 90
- skipFiles = .svn,.git,_notes,nbproject,.idea,.DS_Store
- Теперь создаем новое ТВ (Дополнительное поле) и назначаем его для нужного нам шаблона. Имя нашего тв будет "gallery". На вкладке параметры ввода указываем:
- Тип ввода "migx"
- Конфигурации "resourcegallery"
- На вкладке источник файлов указываем наш созданный источник "resources"
Собственно все, уже должно работать. Не забудьте создать саму папку для ресурсов, у меня она называется "res" и лежит "assets/images/res/". т.е то что мы указали в basePath и baseUrl.
И еще
Кнопка "Load from mediasource" будет загружать в migx картинки находящиеся по адресу "assets/images/res/id папки текущего ресурса". т.е можно находясь на нужном нам ресурсе загрузить картинки с помощью источника файлов а затем нажав на эту кнопку они подгрузяться в migx.
А кнопка "Upload Files" будет сразу загружать картинки с помощью загрузчика Modx.
Чтобы кнопки были на русском, нужно перейти в Управление словарями и создать две записи.
- migx.load_from_source
- Пространство имен migx
- Тема default
- Язык ru
- Значение "Импорт из файловой системы"
- migx.upload_images
- Пространство имен migx
- Тема default
- Язык ru
- Значение "Загрузить файлы"
Вывод на той-же(текущей) странице
[[getImageList? &tvname=`gallery` &tpl=`@CODE: <img src="[[+image]]" alt="[[+title]]">` &where=`{"published":"1"}` ]]
Вывод в другом месте с помошью pdoTools например
[[getImageList? &tvname=`gallery` &docid=`[[+id]]` &tpl=`@CODE: <img src="[[+image]]" alt="[[+title]]">` &where=`{"published":"1"}` ]]
Тут мы дополнительно передаем "docid" т.е id ресурса с которого нужно выводить изображения.
следовал Вашей инструкции
в итоге после загрузки
фотографии не отображаются на сайте, хотя загружаются
не поможете?