Add blue Glass hover navigation menu in blogger blog easily. 0

Hi friends now add this special blue Glass hover navigation menu in blogger blog easily.

Follow simple and easy step to add this glass effect navigation menu in blogger ---->>>>

* First go to your blogger Dashboard.

* Click in design tab and edit HTML.

* Click in small box to expand your blogger template.

* Now find this code </head> by CTRL+F key.

* Copy below code and paste before </head>

<style type='text/css'>
#mytabs{
float:left;
width:100%;
background:#efefef;
font-size:93%;
line-height:normal;
border-bottom:1px solid #666;
}
#mytabs ul {
margin:0;
padding:10px 10px 0 50px;
list-style:none;
}
#mytabs li {
display:inline;
margin:0;
padding:0;
}
#mytabs a {
float:left;
background:url(&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg78rlUUgpfCqQBihTA_6MO0Zzpv3YNokCfQuPsyCGBO6Jk7HUMEha7bp-V2xkUT0c18J5Qp0M4ZEzeBa_ksL4VkMmLW_Mfksi3Gmkyi6Iq7g1yqZUWZNoTre2asQYw0Fwo4K5Pg39X0y81/&quot;) no-repeat left top;
margin:0;
padding:0 0 0 4px;
text-decoration:none;
}
#mytabs a span {
float:left;
display:block;
background:url(&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjM9V0jV5vPZXwKfBXPKnexWvpUjQhI0oaOM6Dk5HjKz1BEw6I5Pr4lSo-NBxoouyowBKANjuMjvuWkzc2NbFEh0sr0JNsXxOpt8Hhvoi5QlwfV-ibbjdtDZLMCQLGd4-7Kq1dh1B29MO04/&quot;) no-repeat right top;
padding:5px 15px 4px 6px;
color:#666;
}
#mytabs a span {float:none;}

#tabsF a:hover span {
color:#FFF;
}
#mytabs a:hover {
background-position:0% -42px;
}
#mytabs a:hover span {
background-position:100% -42px;
}
</style>

* Now click to save your blogger template.

* Again go to your blogger Dashboard and click in design tab.

* Now you are here--->>> Page element.

* Click in Add Gadget which is in below blogger Header.

* When open new window click in HTML/javascript from list.

* When open new blank box copy below code and paste in blank box.

<div id="mytabs">

<ul>
<li><a href="TAB1 URL HERE"><span>TAB1 TITLE HERE</span></a></li>
<li><a href="TAB2 URL HERE"><span>TAB2 TITLE HERE</span></a></li>
<li><a href="TAB3 URL HERE"><span>TAB3 TITLE HERE</span></a></li>
<li><a href="TAB4 URL HERE"><span>TAB4 TITLE HERE</span></a></li>
<li><a href="TAB5 URL HERE"><span>TAB5 TITLE HERE</span></a></li>
<li><a href="TAB6 URL HERE"><span>TAB6 TITLE HERE</span></a></li>
<li><a href="TAB7 URL HERE"><span>TAB7 TITLE HERE</span></a></li>
</ul>

</div>

NOTE:- change Highlighted text in above code with your own ok .

* Now click to save your HTML/javascript now you are done.

blogger tutorials Social Bookmarking Blogger Widget

I'm reading: Add blue Glass hover navigation menu in blogger blog easily. ~