Разные классы для ссылок в меню UMI.CMS.

Oct 25, 2011 13:10



Заканчиваю работу над проектом для сети гомеопатических аптек г. Санкт Петербурга. Вначале, как водится была работа над дизайном сайта. Сейчас заканчивается процесс создания «сайта под ключ» из готовых макетов используя UMI.CMS. На разрабатываемом сайте,технически говоря получается три меню расположенных в разных блоках. В одном из них, нужно вывести свое, уникальное оформление для каждого из пунктов. Как это сделать и хочу рассказать. Подробности под катом



Итак, нужно сделать так, чтоб для каждой ссылки мы могли прописать свой класс, и оформить его через CSS:


В стандартном функционале UMI.CMS нет такой возможности. Зато есть модуль «Шаблона данных», который сильно выручает в таких ситуациях. Идем в админку сайта, «Модули > Шаблоны данных». Уже на самой странице ищем «Тип данных > Раздел сайта > Страница контента».




Внутри настроек «Страницы контента» добавляем новую группу. Пусть будет «Дополнительные параметры меню». Внутри этой группы два поля «Класс пункта меню» и «Класс активного пункта меню» Тип поля ставим «Строка»..




Благодаря нашим манипуляциям на странице редактирования контента появился созданный нами блок.  Вносим название css классов во вновь созданные поля.




Остались сущие мелочи, расставить макросы в шаблоне меню. Идем в каталог /tpls/content/menu/ и создаем новый шаблон меню со своим уникальным именем. Дефолтный шаблон (default.tpl) разумней всегда оставлять девственно не тронутым.
Правим код шаблона под свои нужды. У меня это выглядело так:

$FORMS['menu_block_level1'] = << %lines% END; $FORMS['menu_line_level1'] = <<END; $FORMS['menu_line_level1_a'] = <<END;

Если не обратили внимание, важным моментом здесь было вставка макросов в классы «class="%class_css%"» и «class="%active_class_css%»

Осталось прописать css стили. Надеюсь вы их прописали на этапе верстки страницы. Результат можно посмотреть по этой ссылке

Вот и все :)

free-lance, work, umi.cms

Previous post Next post
Up