Hellow guys,,You will make a Sub Menu in Your Blog Like this picture,,,,??
First, change the menu and adjust the settings tab menu page will be displayed. in "Show Pages as" select "Top Tabs" like in this picture below:
Second, open the template editor by clicking on the 'Template'> 'Edit HTML'> 'Proceed'> 'Expand Widget Templates'.
Third, find this code ]]></b:skin> and then paste the following CSS code right on it.
.tabs-inner .widget li ul {
z-index: 100; position: absolute;
left: -999em; height: auto; margin: 0; padding: 0;
border: 1px solid #999999;
}
.tabs-inner .widget li ul, .tabs-inner .widget li ul a,
.tabs-inner .widget li ul li:first-child a {
-moz-border-radius: 0px; -webkit-border-radius: 0px;
-goog-ms-border-radius: 0px; border-radius: 0px;
}
.tabs-inner .widget li:hover ul, .tabs-inner .widget li.sfhover ul {
left: auto;
}
.tabs-inner .widget li li a:hover, .tabs-inner .widget li li a:active {
color: #ffffff; background: rgb(51, 102, 153);
}
.tabs-inner .widget li ul a {
display: block; padding-left: 1.25em; padding-right: 1.25em;
margin-left: 0px; margin-right: 0px; border: none;
color: #000000; background: rgb(243, 244, 246);
}
.tabs-inner .widget li ul, .tabs-inner .widget li ul a {
width: 220px;
}
Fourth, Find <li><a expr:href='data:link.href'><data:link.title/></a></li> code and look at <b:/loop> code contained a few lines below it. Now, insert the following code in the format right under <b:/loop>.
<li><a href='#'>Menu</a>
<ul>
<li><a href='URL'>Sub Menu 1</a></li>
<li><a href='URL'>Sub Menu 2</a></li>
<li><a href='URL'>Sub Menu 3</a></li>
</ul>
</li>
Note: Change the URL matches the URL that will be used in the sub menu and adjust the 'Menu' and 'Sub Menu' in accordance with the text to be displayed. And when it will make some pull down menu, then repeatedly copy the code below and then adjust the settings in the same way as before.
Fifth, Save Template.
This is a picture of the implementation of the script:
<<,,,Good Luck,,,>>
