Статьи Новости Контакты

10.04.2008
Даниил Буров

CMSMS: Я — дизайнер

описание CMS Made Simple

Логотип CMSMS

При создании и последующем администрировании небольшого веб-сайта все обязанности по его управлению может исполнять одно лицо. Однако, как заявлялось ранее создателями, CMS Made Simple нацелен на аудиторию, в том числе и на малый бизнес. Это предполагает качественную работу полноценного сайта. А если их у фирмы несколько? В этом руководстве на обобщенных примерах описываются возможности и обязанности ролей — в данном случае дизайнера. А сам раздел разработчики предназначили для новичков в использовании сайтов, а также для пользователей, которые будут лишь управлять контентом и/или добавлять новости.

Три роли в CMS Made Simple

При создании сайта под управлением CMS Made Simple уже существует три роли: дизайнер, редактор и администратор. Это позволяет CMS Made Simple разделять контент и размещение или структуру и дизайн. Это позволяет фокусироваться дизайнеру на "фэн-шуе" внешнего вида веб-сайта, а редактору заполнять страницы содержимым. После завершения дизайнерской разработки сайта можно добавлять и редактировать контент, не касаясь при этом его фактического расположения.

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

В данном разделе можно узнать пошаговые инструкции, как администратору, дизайнеру и редактору следует выполнять их основные задачи. Разумеется, на небольшом веб-сайте все эти три роли может совмещать один энтузиаст. Но чтобы для наглядности упростить процесс восприятия и объяснить, как работает CMS Made Simple, разработчики в описании разделили все задачи на три роли.

Я — дизайнер

Шаблон (у нас он чаще не переводится — просто template) — это то, где определяется структура веб-страницы. Или, другими словами, это то, что увидит посетитель у себя в браузере, зайдя на ваш веб-сайт. А с помощью таблиц стилей вы определяете, как именно будут представлены элементы этой структуры. Таблицы стилей, которые вы хотите использовать, в этом случае необходимо присоединить к шаблону.

Языком разметки для шаблонов является добрый старый HTML. Таблицы стилей используют CSS для моделирования и форматирования элементов HTML, вместо того чтобы делать это непосредственно в HTML-коде. Таким образом, структура и отображение ваших страниц разделены, оставляя HTML-код чистым и предоставляя вам дополнительные выгоды типа оптимизации механизма поиска (Search Engine Optimization) и тому подобное.

Замечательно, если вы научились использовать фактически один и тот же шаблон и получать при этом страницы, которые выглядят абсолютно по-разному, изменяя при этом только CSS. В данном случае разработчики рекомендуют заглянуть в CSS Zen-Garden, чтобы увидеть и окончательно убедиться, насколько неодинаково может выглядеть один HTML при изменении только CSS (сбоку будут названия примеров различных дизайнов одной страницы). Вот так и работают шаблоны, которые идут вместе с установкой CMS Made Simple по умолчанию.

Из практических соображений шаблоны только почти те же самые. Зато к каждому шаблону прикреплено пять таблиц стилей, которые одинаковы для всех шаблонов. При этом для каждого шаблона есть определенная таблица стилей и еще одна или две таблицы стилей — в зависимости от того, какое меню используется в шаблоне.

Разработчики рекомендуют Flash Video, где описывается, как преобразовать шаблон в шаблон CMS Made Simple.

Шаблоны

Чтобы определить, как будет выглядеть страница веб-сайта, редактор должен выбрать, какой шаблон использовать для каждой из них. Как будут выглядеть доступные шаблоны — работа дизайнера.

Как было уже упомянуто, шаблон задает только структуру страницы, то есть что именно туда будет включено. С помощью таблиц стилей можно работать над дизайном этой структуры, чтобы добиться необходимого внешнего вида и эмоционального впечатления от страницы.

Шаблон в CMSMS создается просто — с помощью HTML и меток
Как создать шаблон в CMS Made Simple? Очень просто. Необходимо использовать простой HTML и ставить метки-заполнители (placeholders) для содержания, меню и так далее. Когда посетитель заходит на сайт, веб-страница автоматически генерируется по шаблону и по меткам заполняется контентом.

Таким образом, можно взять размещение с любой понравившейся веб-страницы и сделать шаблон для своей страницы в CMSMS.

Общие теги в шаблонах CMS Made Simple

Это самые обычные теги для использования при разметке шаблона:

  • {sitename} — добавляет имя сайта, может быть выбрано в Global Settings;
  • {title} — будет заменен заголовком содержания (можно использовать для установки заголовка при создании страниц с содержанием);
  • {stylesheet} — это должно быть между тегами . Это связывает все таблицы стилей, прикрепленные к шаблону. Если это забыть, страница появится без стилей. При желании использовать внешние таблицы можно добавить обычный тег в заголовок;
  • {metadata} — добавит метаданные, которые можно выставить в Global Settings;
  • {content} — это будет заменено реальным контентом выбранной страницы, редактируемое содержание для каждой страницы Content -> Pages;
  • {breadcrumbs} — будет замещено путем к выбранному контенту;
  • {menu} — это одно из самых обычных меню. Полное меню будет автоматически сгенерировано из вашей страницы, где вы расположили метки. Этот тег также может иметь параметры в зависимости от того, как именно вы хотите отобразить меню. Например, {menu collapse='1'} для сворачивания подпунктов меню, чтобы видны были лишь подпункты выбранного пункта меню.

Используемые в шаблонах метки

Длинный список тегов можно найти в меню Extensions -> Tags на панели администратора. Их примерами являются {title}, {stylesheet} и {breadcrumbs}. Чтобы увидеть, как они работают, необходимо нажать на ссылку Help рядом с ними.

При желании можно сделать свои User-defined Tags. Для этого достаточно ввести их имена таким образом {userdefinedtag}.

Модули вставляются посредством использования {cms_module module='modulename'}. Подробнее об их применении написано в их файлах помощи (Extensions -> Modules).

Прикрепление таблиц стилей

Для придания странице какого-либо стиля и размещения на ней отдельных элементов к шаблону приходится прикреплять одну или больше таблиц стилей. В списке шаблонов (Layout -> Templates) необходимо нажать на значке CSS справа от шаблона. Выберите таблицу стилей для прикрепления к шаблону из выпадающего списка доступных и нажмите Add Stylesheet.

Таблицы стилей

В этом разделе описывается, как используются таблицы стилей с шаблонами по умолчанию в CMS Made Simple. Подробнее об изменении некоторых свойств таблиц стилей можно прочитать в разделе Customizing the stylesheets.

Как уже было написано в разделе "Я — дизайнер", таблицы стилей используются для моделирования и форматирования сайта с помощью пометок на языке CSS. Потому разработчики советуют изучить для начала основы этого языка, чтобы знать, что вы в действительности собираетесь делать. Однако тут же они предлагают несколько идей на тему, как изменить несколько базовых вещей, таких как цвет и логотип.

Таблицы стилей прикрепляются к тому шаблону, в котором предполагается использование стилей из этих таблиц. При желании можно прикрепить всего лишь одну страницу к шаблону. Но создатели выбрали метод для шаблонов по умолчанию, по которому CSS разделяется на несколько таблиц стилей, сгруппированных по схожим характеристикам. Это облегчает поиск и изменение некоторых типов стилей.

Таблицы стилей, используемые с шаблонами CMSMS

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

Таблицы стилей, которые прикрепляются ко всем CMSMS-шаблонам:

  • Layout — здесь задаются общие параметры размещения, которые одинаковы для всех CMSMS-шаблонов. Но для каждого проекта, над которым вы работаете, он должен настраиваться по-своему.
  • Typography — здесь производится все моделирование для шрифтов, ссылок, заголовков, изображений, списков и так далее.
  • Colours — все цвета собраны в этой таблице стилей. Единственные доступные здесь свойства — цвет, фон и выделяющий цвет. Не стоит добавлять сюда другие свойства, иначе это может затронуть компоновку всего вашего сайта. Однако на данный момент цвета меню пока находятся в таблице стилей меню.
  • Forms — чтобы сделать более простым процесс просмотра внешнего вида сайта в различных браузерах, все моделирование форм было вынесено в свою таблицу стилей. И вам не придется с этим часто сталкиваться.
  • Tools — это таблица стилей, которая должна быть прикреплена ко всем шаблонам для их корректного просмотра в разных браузерах. Но ее вообще можно не трогать.

Таблицы стилей для навигации:

  • Nav-Horizontal / Nav-Vertical — в зависимости от размещения вашего шаблона вам необходимо будет прикрепить одну или обе из этих таблиц стилей. Придется изменить всего пару вещей, чтобы настроить отображение меню так, как вам надо.
  • Default CSSMenu Horizontal / Default CSSMenu Vertical — если используется выпадающее CSS Menu, то задействуется одна из этих таблиц стилей.

Таблицы стилей для определенных шаблонов:

  • Layout-XXX — есть одна таблица стилей, которая является определенной для каждого шаблона. Именно здесь задается размещение (а возможно, и моделирование), которое используется для специфического шаблона. Например, изменяя только эту таблицу стилей, можно получить меню сверху или сбоку, слева или справа.

Итого

Таким образом, для создания дизайна сайта под управлением CMS Made Simple необходимо знать не только старый добрый HTML, но и основы CSS. С помощью последнего внешний вид сайта можно изменять радикально. Для удобства таблицы стилей разработчики делят на три группы: общие, навигационные и специальные. А в разметке шаблона используются самые простые теги — ведь простота изначально закладывалась в основу этой системы управления.




Скоро на сайте

  • Wordpress

    Серия статей о плагинах к движку WordPrress
  • AJAX

    Проекты и продукты, ориентированные на AJAX
  • Новые сервисы Google

    Обзор новых сервисов Google
 

Copyright © 2003—2017 Все права защищены

При использовании материалов сайта ссылка на hostinfo.ru обязательна

  • хостинг от .masterhost
  • Rambler's Top100