Joomla 1.5 Подсветка активного пункта меню и активного раздела многостраниченого документа

Подсветка активного пункта меню и активного раздела многостраниченого документа Решено

Занимаюсь переносом сайта с 1.0 на 1.5. Шаблон под 1.5 приходится верстать заново. Наткнулся на две вещи, которые никак не удается победить:

1. Подстветка активного пункта меню

HTML меню, который генерит Джумла выглядит следующим образом:

Код (PHP):

1. <div id="right">
2. <ul class="menu">
3.     <li class="item1">
4.         <a href="/index.php"><span>Главная</span></a>
5.     </li>
6.     <li class="item3">
7.         <a href="/index.php/about"><span>Об авторе</span></a>
8.     </li>
9.     <li id="current" class="active item2">
10.         <a href="/index.php/travel"><span>Путешествия</span></a>
11.     </li>
12.     <li class="item4">
13.         <a href="/index.php/feedback"><span>Обратная связь</span></a>
14.     </li>
15. </ul>
16. </div>

Как я понимаю, за активный пункт меню отвечает id="current". Задаю стили для class="menu" и для id="current" (перепробовал несколько вариантов, это самый последний):

Код (PHP):

1. .menu {
2.     font-size: 0.95em;
3.     text-decoration: none;
4.     font-weight: normal;
5.     text-align: left;
6. }
7.  
8. ul.menu {
9.     padding: 0.7em 0 1em 0;
10.     margin: 0 0 0 10px;
11. }
12.  
13. ul.menu li {
14.     background: url(../images/arrow-blue.png) no-repeat left;
15.     list-style-type: none;
16.     margin: 0;
17.     padding: 0.3em 0 0.3em 15px;
18.     border-bottom: 1px dotted #445566;
19. }
20.  
21. ul.menu li a:link, ul.menu li a:visited {
22.     text-decoration: none;
23.     color: #F00;
24.     font-weight: normal;
25. }
26.  
27. ul.menu li a:hover {
28.     text-decoration: none;
29.     color: #333;
30.     font-weight: normal;
31. }
32.  
33. li#current a:link, li#current a:visited {
34.     text-decoration: none;
35.     color: #000;
36.     font-weight: normal;
37. }
38.  
39. li#current a:hover {
40.     text-decoration: none;
41.     color: #333;
42.     font-weight: normal;
43. }

Не реагирует - активный пункт не выделяется, при наведении мышкой тоже ничего не подсвечивается. Стили для стандартных a, ul, li в файле CSS также есть, но выше.

2. Подсветка активного раздела многостраничного документа.

Есть документ, который разбит на стрницы стандартной джумловой функцией. В начале документа выводится его оглавление. HTML, который генерит Джумла, выглядит следующим образом:

Код (PHP):

1. <table cellpadding="0" cellspacing="0" class="contenttoc">
2. <tr>
3.     <th>Оглавление</th>
4. </tr>
5. <tr>
6.     <td>
7.     <a href="/index.php/travel/1-v" class="toclink">Введение</a>
8.     </td>
9. </tr>
10. <tr>
11.     <td>
12.     <a href="/index.php/travel/1-v?start=1" class="toclink">Часть первая.</a>
13.     </td>
14. </tr>
15. <tr>
16.     <td>
17.     <a href="/index.php/travel/1-v?start=2" class="toclink active">Часть вторая.</a>
18.     </td>
19. </tr>
20. <tr>
21.     <td>
22.     <a href="/index.php/travel/1-v?start=3" class="toclink">Часть третья.</a>
23.     </td>
24. </tr>
25. </table>

В файле CSS задал стили для class="contenttoc" и class="toclink". С этим все ясно. Но никак не пойму, каким образом задать стиль для class="toclink active". Что вообще означает "toclink active"? Ведь это не может быть названием класса?

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

Как с этим бороться?

 

Вроде решил проблему. Получился вот такой код:

Код (PHP):

1. .menu {
2.     font-size: 0.95em;
3.     text-decoration: none;
4.     font-weight: normal;
5.     text-align: left;
6. }
7.  
8. ul.menu {
9.     padding: 0.7em 0 1em 0;
10.     margin: 0 0 0 10px;
11. }
12.  
13. ul.menu li {
14.     background: url(../images/arrow-blue.png) no-repeat left;
15.     list-style-type: none;
16.     margin: 0;
17.     padding: 0.3em 0 0.3em 15px;
18.     border-bottom: 1px dotted #445566;
19. }
20.  
21. ul.menu li a:link, ul.menu li a:visited {
22.     text-decoration: none;
23.     color: #F00;
24.     font-weight: normal;
25. }
26.  
27. ul.menu li a:hover {
28.     text-decoration: none;
29.     color: #333;
30.     font-weight: normal;
31. }
32.  
33. #current a:link, #current a:visited {
34.     text-decoration: none;
35.     color: #0F0;
36.     font-weight: normal;
37. }
38.  
39. #current a:hover {
40.     text-decoration: none;
41.     color: #000;
42.     font-weight: normal;
43. }

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

 

Как-то я сам с собой разговариваю

В общем вторая задача тоже решена. Пришлось только спецификацию на CSS изучить. Вот что получается:

Код (PHP):

1. .contenttoc {
2.     border: 1px dotted #445566;
3.     padding: 1em 1em 1em 3em;
4.     text-align: left;
5.     width: 100%;
6. }
7.  
8. .contenttoc th {
9.     font-size: 1em;
10.     font-weight: bold;
11. }
12.  
13. .contenttoc td {
14.     font-size: 0.95em;
15.     font-weight: normal;
16. }
17.  
18. a.toclink:link, a.toclink:visited, a.toclink:hover {
19.     font-weight: bold;
20.     color: #0F0;
21. }
22.  
23. a.active:link, a.active:visited, a.active:hover {
24.     font-weight: bold;
25.     color: #F00;
26. }

Но вообще нет никакого единообразия у программистов. В меню они активный пункт через id помечают, в оглавлении через дополнительный класс. И документации по созданию шаблонов создать не удосужились.

Тему можно закрывать.

 

норма, мне тож пригодится темка )

 

меня тоже интересует 1-й вопрос темы. Но такого кода как у вас в моем шаблоне сроду не было. Шаблон сделан в Artisteer 2.
Моя тема с проблемой - http://joomla-support.ru/thread1764-2.html

 

Коллеги, нуждаюсь в вашей помощи!
Сайт www.paintballmfp.ru
1. Как сделать в верхнем горизонт. меню чтобы родительский пункт (Площадки) не нажимался, а только раскрывал подменю и при активном пункте подменю родительская кнопка (Площадки) подсвечивалась
2. Как сделать, чтобы в главном меню при нажатии пункта (Выбрать площадку) пункт раскрывался на подменю
Спасибо