Оригинальное горизонтальное меню для блога



Предлагаю красивое горизонтальное меню для Ваших блогов


Всем здравствуйте! Разрешите предложить Вам еще вариант горизонтального меню для Вашего блога. Мне меню очень нравится и установка легкая, без изменения в шаблоне блога. Вставляем в дизайне-добавить гаджет. Посмотрите на скриншоте, как выглядит меню:


Установка и настройка горизонтального меню для блога

Копируем код


<style type="text/css">.menu li{list-style:none;display:inline}.menu li a{-moz-transition:all 270ms ease-in-out 0s;-webkit-transition:all 310ms ease-in-out;-o-transition:all 270ms ease-in-out;background:url("https://1.bp.blogspot.com/-e8VrFODNr7s/T2TK3jW0ZYI/AAAAAAAAALA/wH-oW-79nzA/s1600/noop-menu-blogger.png") repeat scroll 0 0 transparent;border:1px solid #1357AF!important;border-radius:3px 3px 3px 3px;color:#FFFFFF!important;font:14px arial!important;padding:10px 38px!important;text-decoration:none;text-shadow:1px 1px 0 #000;margin-left:-5px}.menu li a:hover{background-position:right center!important}</style><a href="" style="position: absolute;z-index:-11;"><img src="https://1.bp.blogspot.com/-RikrI-c_pyQ/T2DTcP6aMvI/AAAAAAAAAL0/H6v7PVoHM_w/s1600/1x1juice.png" /></a>

<div class="noop-menu-blue">
    <ul class="menu">
        <li><a href="https://xxx/">Главная</a></li>
        <li><a href="https://ххх">Об авторе</a></li>
        <li><a href="https://xxx">Содержание</a></li>
        <li><a href="https://xxx">Контакты</a></li>
        <li><a href="https://xxx">RSS</a></li>
     
        <li><a href="ххх">Blogger</a></li>
    </ul></div>




Front:14px размер шрифта; впишите адреса и заголовки ссылок.

Чтобы добавить ссылку, впишите такую строку:   <li><a href="https://xxx">Виджеты</a></li>.  

На этом у меня все. Комментируйте, делитесь с друзьями. Всего Доброго.





Автор статьи ✎ Olga Protasova Выпуск ✹ 3/20/2014 Ярлыки ►


Открыть комментарии →

7 коммент. :

  1. Красивое меню. Но у меня на блоге не работает. Почему не пойму. Спасибо за нужности для новичка.

    ОтветитьУдалить
    Ответы
    1. Вячеслав здравствуйте. А Ваш блог на Blogspot? Если да, то посмотрите в настройках браузера включен ли Java/Script. У меня в этом блоге такое же меню, работает. За нужности пожалуйста.

      Удалить
  2. Добрый день, Олечка! Я давно хотела такое меню, всё супер, всё работает!!! Спасибо огромное!!!! Вот только с цветами разберусь и будет всё супер!

    ОтветитьУдалить
  3. Поставила Ваше меню, очень нравится. Еще раз спасибо! Я попробовала изменить цвет, всё получилось, но анимация стала другая, не пойму в чем причина... Можете мне помочь? Вот ссылка на тестовый блог - https://testelenalazareva.blogspot.ru/

    ОтветитьУдалить
    Ответы
    1. Елена Лазарева, здравствуйте. Протестировала код меню в своих демо блогах на разных шаблонах, анимация тоже отличается.
      Одной из причин может быть конфликт со скриптами. В основном в блогах, где вставлены разные фишки для заголовков, ярлыков, гаджета ПЧ и др.
      А так нормально у Вас смотрится меню.

      Удалить
  4. Спасибо, Ольга! :) Пишу так, у меня кнопка ответить не работает.

    ОтветитьУдалить
    Ответы
    1. Елена, пожалуйста. Понравились Ваши работы в блоге, Вы молодец. Будут вопросы, обращайтесь.

      Удалить


Ув. читатели! Для вставки HTML кода в комментарии, воспользуйтесь Генератором HTML кода

 
Технологии Blogger.

Форма для связи

Имя

Электронная почта *

Сообщение *