Как привязать изображение к странице?
Помимо возможности добавлять изображения в контент страницы посредством FilePicker из визуального редактора TinyMCE, разработчики и дизайнеры в CMS Made Simple уже давно ищут возможность так называемой ассоциации одного изображения и страницы. Для чего это нужно? Вот несколько примеров:
-
Для создания графического меню, в котором выводится не текст, а изображение. Посмотрите на интересный пример графического меню в стиле Mac или графическое меню с иерархией внизу сайта после слова Portfolio.
-
Для создания списка страниц (типа тизера) с привязанным к каждой странице изображением.
-
Для ограничения редакторов страницы, которые не в состоянии уменьшать и аккуратно вставлять изображения в контент. В этом случае им предлагается выбрать из списка одну из уже загруженных картинок, которая потом в шаблоне вставляется в нужном месте нужного размера. Или возможность загрузки изображений, которые будут уменьшаться при загрузке автоматически.
На данный момент существуют три возможности привязки изображения к странице (по крайней мере других я не знаю).
Вариант 1: Изображение на вкладке Опции
Это была самая первая попытка привязки изображения к странице, которая и сейчас еще доступна на вкладке Опции при редактировании страницы. Здесь можно выбрать одно из изображений в списке файлов, которые предварительно были загружено в папку uploads/images. Путь к этой папке можно изменить только глобально в общих настройках сайта (Администрирование сайта » Общие настройки, вкладка Настройки редактирования страниц). Выбранное изображение становится доступным в шаблоне меню через переменную $node->image, а его эскиз через $node->thumbnail. При помощи этой опции можно ассоциировать только одно изображение с одной странице, т. е. 1:1.
Вариант 2: Изображение посредством тега {content_image}
Вторая попытка. Тег добавляется в основной шаблон сайта. Если добавить тег несколько раз, то можно присоединить несколько изображений для одной и той же страницы. В административной панели в этом случае отображается выпадающее меня для выбора загруженных файлов (как и в варианте 1), а на самой странице он выдает HTML тег img. {content_image} более интеллигентен, чем первый вариант, в частности он позволяет настроить папку, в которой хранятся изображения.
Но его большой недостаток, как и у первого варианта, заключается в том, что изображения, которые можно выбрать из списка, предварительно должны быть загружены в систему с помощью менеджера файлов или в пункте Управление изображениями. Если Вы (в воспитательных целях) удалили кнопку "Вставить/редактировать изображение" из визуального редактора, дабы запретить их прямую вставку в контент сайта, то Ваш редактор сначала должен загрузить картинки, а потом уже редактировать страницу. Второй недостаток: если этих изображений очень много, то список получается огромный и в нем можно легко запутаться.
Вариант 3: Использование модуля GBFilePicker
Модуль GBFilepicker необычайно гибок. Он позволяет не только выбирать уже загруженные изображения, но и загружать их "на лету" во время редактирования страницы, а также удалять и даже редактировать уже загруженные, не выходя со страницы редактирования контента. Список изображений в выпадающем меню при этом может быть показан или отключен (например, если в папке уже присутствуют 100 изображений, то список скорей всего бесполезен).
Несколько примеров, как этот тег может выглядеть в административном интерфейсе на странице с редактированием контента, в зависимости от используемых параметров.
Возможности модуля: уменьшение файлов при загрузке, исключение определенных файлов из списка по суффиксу или префиксу в названии файла, возможность ограничить расширения для загружаемых файлов, возможность ограничить доступ к файлам в зависимости от пользователя, создание эскизов. И особенно люблю я этот модуль за то, что он не только название файла в списке, но и его эскиз редактору показывает, что для забывчивых необычайно удобно.
Этот вариант, пока самое лучшее, что я вижу в CMS Made Simple. Именно его мои редакторы сайтов схватывают интуитивно.