Лабораторная работа № 5
Дизайн и функциональность сайта
Цель работы: получение практических навыков изменения дизайна и расширения функциональности сайта в системе DotNetNuke.
Задачи:
Дизайн сайта в DNN;
Описание функциональных возможностей ядра DNN;
Разграничение прав доступа в соответствии с ролями пользователей;
Подключение и настройка модуля Store для создания Интернет-магазина.
Дизайн сайта в DNN
Дизайн – один из наиболее важных компонентов сайта. В системах управления контентом (CMS) для изменения дизайна используются разнообразные темы и шаблоны, что позволяет легко и быстро настроить внешний вид вашего сайта.
Основными элементами дизайна являются skins (темы), containers (контейнеры), style sheet (таблица стилей) и body background (фон).
В системе DotNetNuke в качестве тем оформления / шаблонов используется специальный термин «skin», который позволяет описывать оформление и расположение элементов на страницах сайта.
Установочный пакет скина представляет собой zip-архив, который включает файлы с html-кодом, изображениями, а также может включать таблицы стилей. Его можно загрузить с помощью File Manager в панели администрирования или добавить/удалить в разделе «Site Settings». Скин может предоставлять горизонтальное или вертикальное меню, различные стили контейнеров (похожи на скины для модулей), различные элементы, что очень удобно для дизайнеров.
Можно воспользоваться готовыми скинами (специализированные сайты размещают материалы для загрузки) либо разработать уникальный скин специально для сайта. Огромное количество скинов (как бесплатных, так и коммерческих) можно найти на сайте www.snowcovered.com. Исключительно бесплатные скины размещены на сайте www.freedotnetnukeskin.com. Последние разработки дизайнеров DNN представлены на официальном сайте в разделе DotNetNuke Design Challenge 2010.
Контейнеры составляют особенные модули и могут быть применены к одному или нескольким модулям. Установочный пакет загружается с помощью File Manager в панели администрирования. Управление им может осуществляться глобально в разделе «Site Settings» или в настройках для каждого модуля.
По умолчанию таблицы стилей предоставляют стандартизированный вид сайта. Таблицы стилей контролируют шрифты, цвета и стили на всех страницах сайта. Также существуют специальные таблицы стилей, которые позволяют настроить отображение отдельных модулей, скинов и внутри контейнеров на странице.
В качестве фонового изображения сайта можно использовать отдельные изображения и цвета. Изображение загружается с помощью File Manager в панели администрирования и может быть добавлено/удалено в разделе «Site Settings».
Рисунок 1 - Просмотр доступных в системе скинов и контейнеров
В данной лабораторной работе подробнее рассмотрим изменение скина и контейнеров веб-сайта.
Управление скином, установленным по умолчанию, осуществляется только администраторами. Эта настройка применяется ко всему сайту и новым создаваемым страницам.
В панели администрирования выберем раздел «Skins».
Здесь вы сможете посмотреть и выбрать доступные скины и контейнеры (рис.1).
Выберите для просмотра коллекцию скинов из выпадающего списка вверху страницы (рис.2).
Рисунок 2 - Выбор и настройка параметров скинов и контейнеров
Тип скина (флажки «Host» и «Site», рис. 2) указывает, желаете ли вы применить опции скина к хосту (для всех) и/или для сайта.
Внизу
страницы вы можете указать, следует ли
применять выбранный скин ко всему
порталу или только к страницам
администрирования вашего сайта.
Выберите подходящий скин и примените его настройки к сайту (ссылка «Apply»). Если скин включает изображение, он создает уменьшенное изображение, обеспечивающее
Рисунок 3 - Панель выбора установленных в системе скинов
по клику доступ к изображению в полном размере. Вы также можете использовать режим предварительного просмотра (ссылка «Preview»), который вызовет всплывающее окно с отображением главной страницы, к которой применен выбранный скин (рис. 3).
Таким образом, можно изменить скин, установленный на сайте по умолчанию.
Управление контейнером, установленным на сайте по умолчанию, осуществляется подобно управлению скинами. Аналогично скинам, эта настройка применяется ко всему сайту и ко всем новым модулям, которые вы создаете. Возможно специфицировать различные контейнеры для отдельных модулей.
Рассмотрим изменение скина/контейнера для отдельных страниц сайта. Помните, что при установке скина и/или контейнеров на уровне страницы эти настройки не влияют на настройки по умолчанию.
Когда вы изменяете контейнер по умолчанию для отдельной страницы, этот контейнер применяется ко всем модулям, которые добавляются на эту страницу.
Перейдите к странице, скин или контейнер которой вы хотите изменить. Выберите пункт «Settings» из области «Page Functions» в панели управления (Control Panel).
На странице «Page Management» выберите дополнительные настройки «Advanced Settings», сгруппированные значком «+». В разделе «Appearance» перейдите к пунктам «Page Skin» и «Page Container» (рис. 4).
Переключатели «Host» и «Site» указывают, желаете ли вы применить опции скина, предоставляемые любым из хостов или только для сайта.
Рисунок 4 - Изменение параметров скинов и контейнеров для отдельных страниц
Выберите скин и/или контейнер, который вы бы хотели применить к данной странице. По ссылке «Preview» доступен режим предварительного просмотра выбранных опций. После этого обновите настройки, чтобы сохранить сделанные изменения.