0 How To Customize Navigation Menu On Blogger

Hello Pro Bloggers Today I Am Teach You How To Customize Navigation Menu On Blogger.So Follow My Steps..............


1-> Please Download Backup Your Blog

2-> Click On Layout And Click On Add Gadget

3-> Select The HTML/JAVASCRIPT

4-> Paste The Below Code

<div class="shadowblockmenu">
<ul>
<li><a href="#">*</a></li>
<li><a href="#">*</a></li>
<li><a href="#">*</a></li>
<li><a href="#">*</a></li>
<li><a href="#">*</a></li>
<li><a href="#">*</a></li>
</ul>
</div>

5-> Change # With Your Link And Change * With Your Tab Name You Want

6-> Now Save Your HTML/JAVASCRIPT

7-> Now Go To Template And Select Customize

8-> Now Click On Advanced And Click On Add CSS

9-> Now Paste The Below Code

/* The CSS Code for the menu starts here www.showmedreams.blogspot.com */

.shadowblockmenu{
font-weight: bold;
font-size: 85%;
width: 687px;
margin:0 auto;
}
.shadowblockmenu ul{
border: 1px solid #BBB;
border-width: 1px 0;
padding: 0;
margin: 0;
overflow: hidden;
}
.shadowblockmenu ul li{
display: inline;
margin:0;
padding:0;
}
.shadowblockmenu ul li a{
display:block;
float:left;
text-transform: uppercase;
color: #494949;
padding: 8px 15px 8px 9px;
margin: 0;
text-decoration: none;
border-right: 1px solid #BBB; 
-moz-box-shadow: inset -7px 0 10px rgba(114,114,114, 0.4); (114,114,114, 0.4) specifies rgb values, last specifies opacity */
-webkit-box-shadow: inset -7px 0 10px rgba(114,114,114, 0.4);
box-shadow: inset -7px 0 10px rgba(114,114,114, 0.4);
text-shadow: 0 -1px 1px #cfcfcf; 
-moz-transition: all 0.2s ease-in-out;
-webkit-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
-ms-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}
.shadowblockmenu li:nth-of-type(1) a{
border-left: 1px solid #BBB;
padding-left:25px;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjulFTP2HU2moQbVdrG1x_fprB-8TPKaH9cb8H7zAPdntU2puJamnxAN3-BixYk95xMejCOQklXBLSYGCW2B2WQF85WKSK2SsX2ZpPYLdLE-AvWsFERmbruOkp1sBqoPmHa4rAZJ1a0IyQ/s1600/bt_home.png) 1px center no-repeat; 
}
.shadowblockmenu li:nth-of-type(2) a{ 
padding-left:25px;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2ei9bGG6CY2KHErsvb2-3TzRTre6wHI0zKGrYOsB6jVieEZQcLeGw5jOI3opuS7HxArItb2yH1wzAUqGxR0bZKtr9cKFqUHuJwImRdhY_22YVOtWqBSkgT3YpRKCEaQ9yVO79snOQz9c/s1600/bt_bulb.png) 1px center no-repeat; 
}
.shadowblockmenu li:nth-of-type(3) a{ 
padding-left:25px;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-xF5PRwU5FaQgzTpyzvj0ge1hBeWB4keukPUVlWaAaTEzNb0dOx5RXEB7GrURgNP-VZzrIdbSfDOBssavkefIALs1CpWcpEQcPoNf-7n0ErLGlmBWtQvYEdgXBCS2agb2wTq_23y8Mmw/s1600/bt_database_add.png) 1px center no-repeat; 
}
.shadowblockmenu li:nth-of-type(4) a{ 
padding-left:25px;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj1mXMKibdknTdvtcYe5WC62jKDuZOhBWwxfpF8nX6u6RmKGx8M7DU4Quj6dwipiYns5yxmlV4P-ggVtaoVL5sU4SgHsZSn5QklRmxV0XxTjHxAbbN169pDDiLoBQSJbITjKbuEh6jQenE/s1600/bt_films.png) 1px center no-repeat; 
}
.shadowblockmenu li:nth-of-type(5) a{ 
padding-left:25px;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjkg-hhj3lIw7Vm3AW_vuNKEOVAM6vAyAlUnV0ZoyRV5dj0s3nJCZmMS-Ya84wBLlV3cnKBCVIy-3JWzuhD08-KBf2-8rrFacQBREB2c7s_OzOc5RxYtis2nSLV2rskzzsWNxQEi-4y7Q0/s1600/bt_mobile-phone.png) 1px center no-repeat; 
}
.shadowblockmenu li:nth-of-type(6) a{ 
padding-left:25px;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhsR_WBytPFrfePPERFb61j8wIyUcj6HjyVg6wDfHfuQxjHmhHrTPObia6xDvHuGvNmzfnSBiHspQXZqrxuzcmmnbGo4U5drYdNsA1ryqizGdk6lAX50O79Vc8UYrSI6ciH6mFWUhqrP28/s1600/Bt_Help_Circle_Blue.png) 1px center no-repeat; 
}
.shadowblockmenu ul li a:hover{
color: black;
-moz-box-shadow: inset -7px 0 10px rgba(60,162,221, 0.4), inset 0 0 12px rgba(60,162,221, 0.6);
-webkit-box-shadow: inset -7px 0 10px rgba(60,162,221, 0.4), inset 0 0 12px rgba(60,162,221, 0.6);
box-shadow: inset -7px 0 10px rgba(60,162,221, 0.4), inset 0 0 12px rgba(60,162,221, 0.6);

10-> Now Click On Apply To Blog

Yipeeeeeeeeeeeee....... See Your New Navigation Menu

Please Leave Your Question And Comment Below