Hello friends navigation menu very important for your blog fo adding HOME, CONTECT, SITEMAP etc.
So here i will give you best navigation menu for your blog It's name is Blacky .
Follow simple step to adding this navigation menu in your blog ----->>>>
* First go to your blogger Dashboard.
* Now click in design tab and edit HTML.
* Click in small box to expand your blogger Template now.
* Find this code ]]</b:skin> By ctrl+F key easily.
* Copy below code and paste before ]]</b:skin>
So here i will give you best navigation menu for your blog It's name is Blacky .
Follow simple step to adding this navigation menu in your blog ----->>>>
* First go to your blogger Dashboard.
* Now click in design tab and edit HTML.
* Click in small box to expand your blogger Template now.
* Find this code ]]</b:skin> By ctrl+F key easily.
* Copy below code and paste before ]]</b:skin>
#container{width:860px;margin:0 auto;margin-bottom:20px}
#main-container{background:#FFF;padding:0 12px;width:auto;padding-bottom:24px}
#nav-bar{height:46px}
#top-header{background:#ffffff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjymz0hH6NRcmN9WJUPaT9RBOKn1ffS3ayl8DV4qGYJrDA3Or07PV0Q6ei3gIaunGz-0XRotll9JapmnqywtVR9k-JLUoA0eqsTJ-Zv5NlNBGJBZzRhL4yjVpbIpAm4WoNysDCv1enlGcSM/) repeat-x;height:120px;}
#egglabs-header{background:url() left 10px no-repeat;margin:0 auto;padding:0px;width:860px}
#top_bar{height:118px}
#nav-bar{font-size:12px;color:#040000;height:46px;margin-left:120px}
#nav-bar a:link,#nav-bar a:visited{color:#FFF;text-decoration:none;font-size:11px;font-weight:bold;margin-right:14px}
#nav-bar a:hover{color:#000}
#menu
{
background-color:#3A3A3A; border:solid 2px #333333; color:#000; height:27px; margin-bottom:14px;border-radius: 6px;-moz-border-radius:6px;-webkit-border-radius:6px;
}
#nav{list-style:none;margin:0;font-family:Gotham,Helvetica,'Arial',sans-serif; text-align:center}
#nav li{
float:left;
min-width:50px;
text-align:center;
text-transform:uppercase;
height:27px;
}
#nav li:hover
{
background-color:#80C8E5;
color:#333;
}
#nav li
{
border-left:1px solid #000;
}
#nav li:first-child
{
border:0px solid #000;
}
#nav li a{font-size:11px;font-weight:bold;color:#fff; padding:7px 12px 7px 12px; display:block; height:26px; min-width:50px; }
#nav li a:hover{color:#333; text-decoration:none}
.bannernew{ text-align:center }
* Now save your blogger template.
* After above step go to blogger Dashboard.
* Now click in design tab and you are here--->> Add new element.
* Click in add Gadget which is below blog Header not a sidebar ok.
* When open new window select HTML/Javascript from list .
* When open blank box copy below code and paste in Blank box ok.
<div id='container'> <div id='menu'> <ol id='nav'> <li><a href='YOUR BLOG ADDRESS HERE'>Home</a></li> <li><a href='TAB1 URL'>TAB1 TITLE</a></li> <li><a href='TAB2 URL'>TAB2 TITLE</a></li> <li><a href='TAB3 URL'>TAB3 TITLE</a></li> <li><a href='TAB4 URL'>TAB4 TITLE</a></li> <li><a href='TAB5 URL'>TAB5 TITLE</a></li> <li><a href='TAB6 URL'>TAB6 TITLE</a></li> <li><a href='TAB7 URL'>TAB7 TITLE</a></li> <li><a href='TAB8 URL'>TAB8 TITLE</a></li> </ol> </div> <div>
NOTE:- You change HIGHLIGHTED color text with your own ok
|
1 Responses So Far:
Bloggers will surely like this post. Navigation menu is indeed very important for your blog. Thank you for sharing.