Выпадающие менюшки были созданы для того, что Вы могли сэкономить место на своих сраницах, создав необходимое количество ссылок.
Они также очень удобны при навигации по сайту/блогу, за счет чего очень востребованы =)
Сегодня мы будем делать выпадающие меню со списком ссылок для Блоггера (Пример такого меню Вы можете найти на этом блоге) , которое при желании и некоторых усилиях можно полностью подогнать под дизайн своего блога!
Во-первых из "Панели инструментов" переходим в "Макет", где выбираем "Изменить HTML" и с помощью поиска (CTRL+F) находим:
</head>
и сразу ПЕРЕД ним вставляем:
<!--MULTI-LEVEL-DD-MENU-STARTS-->
<link href='http://forum.wafl.ru/files/freeman/DDM1_style.css' rel='stylesheet' type='text/css'/>
<script src='http://forum.wafl.ru/files/freeman/DDM1_script.js' type='text/javascript'/>
<!--MULTI-LEVEL-DD-MENU-http://beliber-da.blogspot.com-->
теперь сохраняем шаблон и переходим в "Элементы страницы" и в том месте, где хотете видеть выпадающие меню добавляем гаджет вида "HTML/JavaScript", содержание которого вставляем следующий код:
<!--MULTI-LEVEL-DD-MENU-STARTS-->
<ul id="menu" class="menu">
<li><a href="#" class="menulink">Меню №Раз</a>
<ul>
<li><a href="#">Меню 1 - пункт 1</a></li>
<li><a href="#">Меню 1 - пункт 2</a></li>
<li><a href="#">Меню 1 - пункт 3</a></li>
<li><a href="#">Меню 1 - пункт 4</a></li>
<li><a href="#">Меню 1 - пункт 5</a></li>
</ul>
</li>
<li><a href="#" class="menulink">Меню №Два</a>
<ul>
<li><a href="#">Меню 2 - пункт 1</a></li>
<li><a href="#">Меню 2 - пункт 2</a></li>
<li><a href="#">Меню 2 - пункт 3</a></li>
<li><a href="#">Меню 2 - пункт 4</a></li>
<li><a href="#">Меню 2 - пункт 5</a></li>
</ul>
</li>
<li><a href="#" class="menulink">Меню №Три</a>
<ul>
<li><a href="#">Меню 3 - пункт 1</a></li>
<li><a href="#">Меню 3 - пункт 2</a></li>
<li><a href="#">Меню 3 - пункт 3</a></li>
<li><a href="#">Меню 3 - пункт 4</a></li>
<li><a href="#">Меню 3 - пункт 5</a></li>
</ul>
</li>
<li><a href="#" class="menulink">Меню №Четыре</a>
<ul>
<li><a href="#">Меню 4 - пункт 1</a></li>
<li><a href="#">Меню 4 - пункт 2</a></li>
<li><a href="#">Меню 4 - пункт 3</a></li>
<li><a href="#">Меню 4 - пункт 4</a></li>
<li><a href="http://beliber-da.blogspot.com/">БелиберDA</a></li>
</ul>
</li>
</ul>
<script type="text/javascript">
var menu=new menu.dd("menu");
menu.init("menu","menuhover");
</script>
<!--MULTI-LEVEL-DD-MENU-http://beliber-da.blogspot.com-->
После чего заменить текст на свой а знаки "#" на соответствующие тексту ссылки, а также удалить ненужные строки или добавить новые ;)
Источник: www.dablog.net
