Add simple and sweet navigation menu in blogger blog---->>>>
Follow simple and easy step to adding this menu in your blogger blog---->>>>
* First go to your blogger Dashboard.
* Now click in desig tab and Edit HTML.
* Click in small Box to expand your blogger template.
* Now find this code ]]</b:skin> by CTRL+F key.
* Copy below code and paste before ]]</b:skin>.
Follow simple and easy step to adding this menu in your blogger blog---->>>>
* First go to your blogger Dashboard.
* Now click in desig tab and Edit HTML.
* Click in small Box to expand your blogger template.
* Now find this code ]]</b:skin> by CTRL+F key.
* Copy below code and paste before ]]</b:skin>.
#linkbar-wrapper {
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
width: 978px;
position: relative;
}
#linkbar .widget {
margin: 0px 0px 0px 0px;
padding: 6px 0px 6px 80px;
text-align: left;
background: #fafafa;
border-bottom: 1px solid #7f7f7f;
border-right: 0px solid #7f7f7f;
}
#linkbar ul {
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
list-style-type:none;
}
#linkbar li {
display: inline;
}
#linkbar h2 {
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
display: none;
visibility: hidden;
}
#linkbar a {
clear: both;
margin: 0px -5px 0px 0px;
padding: 8px 25px 7px 25px;
width:100%;
text-decoration:none;
font: normal normal 63% Verdana, sans-serif;
color: #333333;
background: #ffeadf;
border-right: 1px solid #7f7f7f;
border-left: 1px solid #7f7f7f;
border-top: 1px solid #7f7f7f;
border-bottom: 1px solid #7f7f7f;
}
#linkbar a:hover {
font-weight: bold;
color: #E85E03;
background: #ffffff;
}
* 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 your blog sidebar.
* 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='linkbar-wrapper'> <div class='linkbar section' id='linkbar'> <div class='widget LinkList' id='LinkList1'> <ul> <li><a href='TAB1 URL HERE'>TAB1 TITLE HERE</a></li> <li><a href='TAB2 URL HERE/'>TAB2 TITLE HERE</a></li> <li><a href='TAB3 URL HERE'>TAB3 TITLE HERE</a></li> <li><a href='TAB4 URL HERE'>TAB4 TITLE HERE</a></li> <li><a href='TAB5 URL HERE'>TAB5 TITLE HERE</a></li> </ul> <div class='clear'></div>
NOTE:- Remove Highlighted text in above code with your own ok.
* Now click to save your HTML/javascript.
* After saving this element drag and drop below blog header and again click in save button.
* Now you are done. Cheers
|
0 Responses So Far: