Предлагаю вам установить вот такое меню на свой блог:

1) Заходим в «Настройки блога» >> «Оформление» >> «Редактор css»  ✔

2) Перед нами 2 окна, нас интересует второе: «Дополнительный CSS (не заменяется при смене дизайна)», вставляем туда следующий код и нажимаем «Сохранить»  ✔

_____________________________________________

ul.css-menu-2 {
list-style: none;
border-bottom: 1px #888899 solid;
padding-bottom: 10px
}

ul.css-menu-2 li {
display: inline;
margin-right: 5px
}

ul.css-menu-2 li a {
color: #888899;
text-decoration: none;
background: #f7f7f9;
border: 1px #bbbbcc solid;
border-bottom: none;
padding: 10px 14px
}

ul.css-menu-2 li a:hover {
padding: 14px 14px 10px 14px
}

ul.css-menu-2 li a.selected {
color: #555566;
background: #ffffff;
border: 1px #888899 solid;
border-bottom: 1px #ffffff solid;
padding: 14px 14px 10px 14px
 }

_____________________________________________

3) Теперь необходимо разобраться непосредственно с самим кодом меню, т.к. тот код который вы только что вставляли — это код описания стиля нашего будущего меню, конечно там можно все менять на своё усмотрение, но об этом позже. Итак, вот код:

_____________________________________________

________________________________________________________________

Давайте разберёмся что же тут надо изменить. Нас интересует только вот эти строки (на данный момент их 4)  <li><a href="#">Название кнопки</a></li> , где вместо символа #  необходимо вставить ссылки на ваши страницы и вписать названия кнопок в соответствующие места.  ✔  

4) Теперь осталось вставить наш код в свободный блог (включить html — редактор), думаю тут не возникнет вопросов  ✔

Как вы уже поняли, одна такая строка соответствует одной кнопке, не забывайте о том что длина меню ограничена, и если кому то её не хватает, напишите, я расскажу как изменить размер кнопок, фон и т.д.

Все вопросы в комментарии…