22 марта 2014 г.

Горизонтальное меню с поиском и социальными кнопками


Красивое горизонтальное меню с поиском и социальными кнопками

Заработок на сайте

Здравствуйте дорогие блоггеры!

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

Меню вставляем дизайн-добавить гаджет-Html/JavaScript-вставить. Настраиваем и сохраняем.

Ниже прилагаю скриншот, а если прокрутите страницу вниз, можно посмотреть реально.




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


Копируем код ниже

<style>
#bsCSSmenu{border:none 5px #000000;
-moz-border-radius-topleft: 15px;-moz-border-radius-topright:14px;-moz-border-radius-bottomleft:14px;-moz-border-radius-bottomright:14px;-webkit-border-top-left-radius:15px;-webkit-border-top-right-radius:14px;-webkit-border-bottom-left-radius:14px;-webkit-border-bottom-right-radius:14px;
border-top-left-radius:15px;border-top-right-radius:14px;border-bottom-left-radius:14px;border-bottom-right-radius:14px;-moz-box-shadow: 2px 3px 5px #000000;-webkit-box-shadow: 2px 3px 5px #000000;box-shadow: 2px 3px 5px #000000;
width:940px;
 margin: 0 0 0 0px;
 padding: 12px 0 8px 0;
 clear: both;
 background: #111111 left bottom no-repeat;
}
#bsCSSmenu .catList{
 padding: 4px 0 0 35px;
 float: left;
    margin-top:-3px;
}
#bsCSSmenu .pageList{
 padding: 8px 0px 0 0;
 float: right;
}
#bsCSSmenu ul li{
 float: left;
 margin: 0 18px 0 0 ;
}
#bsCSSmenu a{
 color: #fff;
    list-style:none;
    text-decoration: none;
}
#bsCSSmenu a:hover{
 color: #919191;
}
#bsCSSmenu li {
list-style:none;
text-decoration:none;
}
#bssearch{
 margin: -2px 20px 0 0;
 float: right;
}
#bssocial{
 margin-left: 100px;
}
<!--Menu by www.bdblogov.ru-->
</style>
<div class="bsmenustart" id="bsCSSmenu">
<ul class="catList">
<li class="bscat-item-1"><a href="#">Главная</a></li>
<li class="bscat-item-2"><a href="#">Об авторе</a></li>
<li class="bscat-item-3"><a href="#">Контакты</a></li>
<li class="bscat-item-4"><a href="#">AdSense</a></li>
<li class="bscat-item-5"><a href="#">Widget</a></li>
<li class="bscat-item-6"><a href="#">HTML</a></li>
<li class="bscat-item-7"><a href="#">RSS</a></li>
<li class="bscat-item-8"><a href="#">CSS</a></li>
</ul>
<div id="bssearch">
<form action="http://www.google.com/cse" id="cse-search-box" target="_blank">
<div>
<input name="cx" type="hidden" value="004972222991511809341:kobh4_l5t3m" />
<input name="ie" type="hidden" value="ISO-8859-1" />
<input class="googleSearchField" name="q" size="20" style="background-color: white; background-image: url(http://4.bp.blogspot.com/-1Uii8AVSHmA/UasEirYb9XI/AAAAAAAADQ8/mK-t0jydJpI/s1600/BS+Google+Custom+Search.gif); background-position: 0% 50%; background-repeat: no-repeat no-repeat; border: 1px solid rgb(126, 157, 185); padding: 2px;" type="text" />
<input class="button" name="sa" type="submit" value="Search" /></div>
<input name="siteurl" type="hidden" value="bloggerspice.com/" /><input name="ref" type="hidden" value="" /><input name="ss" type="hidden" value="" /></form>
<script src="http://www.google.com/cse/brand?form=cse-search-box&amp;lang=en" type="text/javascript"></script>
    </div>
<div id="http://feeds.feedburner.com/blogspot/tPDSo">
<a alt="Subscribe to RSS" class="http://feeds.feedburner.com/blogspot/tPDSo" href="http://feeds.feedburner.com/blogspot/tPDSo" target="_blank" title="Subscribe to RSS" style="margin-left: 80px;"><img src="http://4.bp.blogspot.com/-GV5tBPml5W4/UasEi3SU2rI/AAAAAAAADRA/qrvW3HxfAQo/s1600/BS+RSS-icon+Menu.png" style="" /></a>
<a alt="Follow Us" class="http://feeds.feedburner.com/blogspot/tPDSo" href="http://twitter.com/violavasil_eva " target="_blank" title="Follow Us"><img src="http://4.bp.blogspot.com/-flfZva27Xjw/UasEjeAUj1I/AAAAAAAADRQ/VOor94MgHgk/s1600/BS+twitter-icon+menu.png" /></a>
<a alt="Become a Fan" class="bssocialicon" href="http://www.facebook.com/olga.protasova.927 " target="_blank" title="Become a Fan"><img src="http://2.bp.blogspot.com/-nWh261blWNY/UasEi1YvFEI/AAAAAAAADRE/iWbAORIPWuY/s1600/BS+facebook-icon+menu.png" /></a></div>
</div>



Настройки: width:940px;-ширина меню; #; CSS-все решетки замените на свои адреса ссылок и названий; http://feeds.feedburner.com/blogspot/tPDSo-замените все строки, выделенные зеленым на свой feed адрес блога; выделенное коричневым и синим-адреса аккаунтов в Twitter и Facebook; Вот и все. Оставляйте отзывы, делитесь с друзьями в социальных сетях. До свидания.

Баннерная сеть People Group
Открыть комментарии →

Комментариев нет:

Отправить комментарий

Кнопки

Почтовые сервисы для заработка

CashTaller.RU
SEO sprint - Всё для максимальной раскрутки!
WMmail.ru - сервис почтовых рассылок
ProfitCentr - рекламное агентство

--