№28. Шаблоны Joomla. Часть 7 |
Автор Леонид Мальков | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
28.08.2008 г. | ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Шаблоны Joomla. Часть 7. Уровень: Пользователь - Веб-мастер Здравствуйте, уважаемые подписчики. Сегодня мы начинаем разговор о стилевом оформлении меню сайта. И продолжим воспроизводить дизайн сайта MailList.ru То есть сегодняшний выпуск является логическим продолжением предыдущего выпуска №27. Шаблоны Joomla. Часть 6. И дорабатывать мы будем наш учебный шаблон efft_table_27 (cкачать efft_table_27). Виды меню в ДжумлеМеню в Джумле создается в одноименном пункте Главного меню админки. При создании меню автоматически создается модуль, связанный с этим меню, который доступен в пункте Главного меню Модули > Модули сайта. В дистрибутиве Джумлы уже заведены следующие меню (название меню / название модуля): mainmenu / Главное меню, othermenu / Дополнительное меню, topmenu / Верхнее меню, usermenu / Меню пользователя. Под видами меню мы будем подразумевать стили модулей меню. Что это? В пункте Главного меню Модули > Модули сайта откройте любой из указанных выше модулей меню, найдите его параметр "Стиль меню", который может принимать следующие значения: Вертикально, горизонтально, плоский список. Сегодня мы разбираем вертикальный стиль меню. Вертикальное менюЛюбому меню сайта можно задать любой стиль. Мы будем сегодня экспериментировать с Главным меню. Откройте сайт с установленным учебным шаблоном. Если посмотрите код страницы, выводящий главное меню, то увидите примерно следующее: <table width="100%" border="0" cellpadding="0" cellspacing="0"> Оцениваем увиденное:
Вот и определились, какие стили будем настраивать. Заметим, что в Джумле может быть и двухуровневое меню, в котором подпункты будут иметь класс "sublevel". Мы остановимся на одноуровневом. Стили ссылок класса "mainlevel"Вот стили, а комментарии ниже: a.mainlevel:link, a.mainlevel:visited, a.mainlevel:hover {
Стиль для ссылки активного пункта меню (id="active_menu")В maillist.ru активный пункт меню НЕ имеет уникального стиля. Задаем стиль на свой вкус (без подчеркивания, оранжевого цвета, начертание курсивом): #active_menu { Готово или нет?!Приглядываемся к mailist.ru Там пункты меню расположены плотнее, чем в нашем шаблоне. Чисто из-за спортивного интереса выясним, каким образом нам сделать также, но сделаем это в следующем выпуске, который выйдет примерно через 1 неделю. Чтобы увидеть разобранные сегодня стили в действии, скопируйте их (если Вы этого еще не сделали :) в шаблон efft_table_27.
Автор данной статьи: Леонид Мальков
Просмотров: 30234
Добавить коментарий |
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Последнее обновление ( 12.09.2008 г. ) |