Очень просто!
Поверьте, что если делать именно так как я расскажу, то у вас появится меню, подобное моему сверху, да оно неказистое, но я ведь вместе с вами облагораживаю блог и поверьте если всё-всё запихнуть в блог - тоже ничего хорошего не получится.
Приступим.
Перед всем этим сохраняем свой старый HTML- читаем первый пункт, во избежании различных осложнений с вашей стороны.
Ищем в тексте HTML кода вашего шаблона такие строки выделенные синим:
<div id='header-wrapper'>
<b:section class='menubar' id='menubar' maxwidgets='1' showaddelement='yes'>
<b:widget id='LinkList2' locked='true' title='Menubar' type='LinkList'/>
</b:section>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='false' title='Beautiful Beta (Header)' type='Header'/>
</b:section>
</div>
а красные вставляем между ними, это мы обозначили, что появился на свет 'menubar'.
Теперь в CSS-части определяем свойства его, вставлять нужно только в CSS, короче туда, где идёт много определений с такими вот значками #, вставлять обязательно одним блоком:
#menubar h2 {display:none;}
#menubar ul {
list-style: none;
}
#menubar li {
float: left;
}
#menubar a:link, #menubar a:visited, #menubar a:hover {
padding: 5px;
display: block;
color: $headerTextColor;
}
#menubar a:hover {
background-color: $headerCornersColor;
}
Заголовка у нашего 'menubar' не будет, а зачем заголовок в меню? Там будут только опции, которые вы сможете добавить в макете.
Сохраняемся, упс и проблема или упс и нормально?
В некоторых шаблонах при сохранении ругается админка. Приблизительно так:
"Invalid variable declaration in page skin: Variable is used but not defined. Input: headerTextColor"
Если так, то это лечится, просто нужно описать переменную, а лучше две переменные, чтобы наверняка, вписываем в код сверху, где описываются переменные:
<Variable name="headerCornersColor" description="Цвет фона меню"
type="color" default="#fff" value="#e6e6e6">
<Variable name="headerTextColor" description="Цвет текста меню"
type="color" default="#c60" value="#5588aa">
Сохраняемся, теперь уж ничто ругаться на будет.
Все изменения цветов буут возможны как обычно, через настройки цветов и шрифтов из админки, кто усёк может побаловаться со шрифтами вводя переменную для шрифта. В общем флаг всем в руки!
Пива всем!
Недавно на основании всех этих полезностей я сменил дизайн.
Сделал это потому что этот блог был первый и пробный - я вообще про всякие CSS HTML JavaScript ничего не знал, но мне очень хотелость чего-нибудь эдакого.
Приглашаю посетить мой новый блог там будет много о чём поговорить.
Ну а в этом будут советы, советы, советы в помощь блоггеру как и задумывалось!
вторник, 12 июня 2007 г.
Создание меню в блоггере
Подписаться на:
Комментарии к сообщению (Atom)
4 комментария:
Thanks! ^)
способ хороший. правда, сейчас много шаблонов уже со встроенными меню и субменю...
Уже бы дополнили статью до конца (я о размере шрифта). Я в этом деле новичок, поэтому делаю все по-шагово, все выше описаное cделал, а со шрифтом проблема...
хах у меня вообще такого кода нету смотрел сам и с помощью ctrl f
Отправить комментарий