В предыдущем выпуске мы выстроили информационную модель сайта, а сейчас рассмотрим на практике, как это работает.
Доброго времени суток, друзья, коллеги, единомышленники, соратники по цеху и просто интересующиеся!
С Вами Дмитрий Жолобов и Вы смотрите третий выпуск канала ИнфоДизайнер.
В предыдущем выпуске мы выстроили информационную модель сайта, а сейчас рассмотрим на практике, как это работает.
Вспомним, что у нас получилось. Имеем 9 базовых типов (сущностей):
А теперь подключимся к нашей демонстрационной базе клиентским приложением и рассмотрим, как работает эта модель на примере системы управления сайтами InfoDesigner JS.
Перед нами главное окно клиентского приложения InfoDesigner, с помощью которого совершаются все действия по разработке, администрированию и информационному наполнению сайта.
Давайте для начала рассмотрим каждый базовый тип с точки зрения его интерфейса управления. Пойдем по порядку, с помощью пункта меню "Структура - Сайты и разделы" откроем окно, в котором происходит управление базовым типом "Сайт" и деревом его разделов.
Откроем карточку управления сайтом. Видим набор полей:
И далее на закладках можем управлять соответственно:
Все файлы таблиц стилей css и java-скриптов, которые мы подключаем к сайту в этих полях, автоматически будут участвовать во всех страницах сайта.
Далее по иерархии опустимся от сайта к его главному разделу. Карточку главного раздела можно открыть прямо с карточки сайта, а можно из окна "Сайты и разделы", выбрав соответствующий элемент списка.
Вот так выглядит карточка редактирования каждого раздела и, в частности, главного раздела сайта.
На главной закладке расположены следующие поля:
Далее в закладках:
Рассмотрим базовый тип "Шаблон страницы". Для управления шаблонами страниц необходимо перейти к соответствующему пункту меню "Структура - Шаблоны страниц". Откроется окно со списком всех имеющихся шаблонов.
Для редактирования необходимо выбрать нужный шаблон и открыть его карточку.
Карточка шаблона имеет поля "Наименование шаблона" и "Содержимое шаблона".
Содержимое шаблона управляется с помощью встроенного визуального редактора, который открывается при двойном клике на поле.
Редактор позволяет вставлять в содержимое текст и задавать ему нужные стили абзацев и шрифтов, изображения, объекты из перечня в выпадающей левой панели, среди которых:
А также при необходимости можно вставлять html-код в чистом виде.
Как мы видим в открытой карточке "Шаблона информационных страниц", данный шаблон содержит атрибуты раздела "Заголовок раздела" и "Контент раздела", инфоблоки "Верхняя панель", "Правая колонка" и "Подвал" и ряд вставок с html-кодом.
Более подробно на работе в этом редакторе остановимся немного позже, а также в следующих выпусках.
В содержимом шаблона используются инфоблоки. Их можно открыть прямо из редактора, а можно открыть хранилище всех инфоблоков, воспользовавшись пунктом меню "Объекты - Инфоблоки" и уже из этого списка выбирать нужный для его редактирования или создать новый с помощью кнопки в панели инструментов.
Управление содержимым инфоблоков происходит при помощи уже упомянутого визуального редактора.
Перейдем к рассмотрению базового типа "Навигатор". С помощью пункта меню "Структура - Навигаторы разделов" отроем окно доступа к экземплярам этого типа. Откроем карточку навигатора "Главное верхнее меню".
Напомню, что навигаторы отвечают за формирование разных меню на сайте. В качестве пунктов меню указываем разделы, которые должны участвовать в этом меню в поле "Разделы сайта в меню" из числа уже имеющихся.
Из базовых типов, которые мы определили в информационной модели, остались "Изображения" и "Файлы". Их мы покажем далее в ходе демонстрации публикации материалов на сайт.
И вот настало время, когда нужно показать управляемый объект, т.е. сам сайт, которым мы управляем в данный момент. Этим сайтом является наш демонстрационный стенд, он имеет тестовое информационное наполнение, а внешний вид выполнен в нейтральном стиле, ссылка на него опубликована под этим видео.
Информационная модель нашего демо-сайта гораздо шире классической, которую мы рассматриваем сейчас. Поэтому будем обращать внимание только на те объекты, которые нами пока определены. А уже в следующих выпусках, по мере рассмотрения всей модели в целом будем подробно останавливаться на рубрикаторе, продуктах и списках продуктов.
А сейчас создадим новый раздел, наполним его тестовым контентом и опубликуем его на сайте.
В качестве исходного материала для этого раздела возьмём краткое описание работы системы InfoDesigner.
Будем создавать раздел первого уровня, чтобы он отобразился в главном горизонтальном меню нашего демо-сайта.
В этом случае родительским разделом по отношению к создаваемому разделу будет "Главный раздел сайта", откроем его карточку редактирования.
Перейдем в закладку "Дочерние разделы", выберем кнопку "Создать раздел сайта" в панели инструментов карточки. Откроется чистая карточка для ввода данных.
Начнем вводить данные в поля карточки сверху вниз из нашего заготовленного документа.
Скопируем заголовок документа и вставим его в поле "Наименование раздела". Титул страницы возьмём также из этого заголовка. Таким же значением наполним поле "Заголовок раздела".
В поле "Имя папки" введем значение "test", в поле "Наименование пункта меню" - значение "Тестовый раздел".
В поле "Шаблон страницы раздела" по умолчанию установился шаблон "Шаблон информационных страниц", его так и оставим.
Перейдем к вводу контента раздела, откроем редактор двойным кликом. Скопируем содержимое документа и вставим его в редактор. Как видим, стилистика документа и вставленного текста сохранилась. Но при необходимости можно нужные места в тексте подкорректировать.
Например, удалим заголовок, т.к. он уже введен нами в соответствующий атрибут раздела, установим стиль списка.
Кроме текста давайте вставим в содержимое раздела еще иллюстрацию. Укажем место, куда будем вставлять изображение, перейдём к пункту меню "Вставка - Изображение". Произойдет автоматический переход к хранилищу изображений.
Исходим из того, что нужного нам изображения в хранилище ещё нет, поэтому сначала его введем из заранее приготовленного графического файла. Создаём новый экземпляр изображения и вводим необходимые данные. Загрузим "Основное изображение", скопируем его в "Раскрывающееся изображение", у основного установим размеры поменьше. Сохраняем в состоянии "готов к публикации", выбираем для вставки в редактор раздела. Закрываем и сохраняем содержимое раздела.
Для того чтобы наш, вновь созданный раздел, появился в меню на сайте, его необходимо добавить в навигатор "Главное меню". Сохраняем и публикуем все на сайт.
По завершении выполнения служб генерации и репликации убеждаемся, что на стенде появился тестовый раздел.
Итак, в этом выпуске мы увидели, как реализована информационная модель сайта, как производится управление базовыми типами и как осуществляется публикация материалов на сайт.
В следующем выпуске мы займёмся расширением созданной модели новыми базовыми типами для выполнения новых задач, поставленных перед сайтом.
Благодарю за внимание и до следующих встреч!
