Follow simple and easy step to adding this special menu to 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 <head> by CTRL+F key.
* Copy below code and paste after <head>
<link href="https://4636338866364619332-a-1802744773732722657-s-sites.googlegroups.com/site/mauganj1/CSS3Multicolumn.css" rel="stylesheet" type="text/css"></link>
* 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 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.
<ul id="css3menu" class="topmenu" style="position: relative;top: -25px">
<li class="topmenu"><a href="#" title="HOME">HOME</a></li>
<li class="topmenu"><a href="#" title=""><span>PRODUCT INFO</span></a>
<div class="submenu" style="width:376px;">
<div class="column" style="width:50%"><ul>
<li><a href="#" title="">2.1 Features</a></li>
<li><a href="#" title=""><span>2.2 Installation</span></a>
<div class="submenu">
<div class="column"><ul>
<li><a href="#" title="">2.2.1Description of Files</a></li>
<li><a href="#" title="">2.2How to Setup</a></li>
</ul></div></div>
</li>
<li><a href="#" title="">2.3 Parameters Info</a></li>
</ul></div>
<div class="column" style="width:50%"><ul>
<li><a href="#" title="">2.4 Dynamic Functions</a></li>
<li><a href="#" title=""><span>2.5 Supported Browsers</span></a>
<div class="submenu" style="width:286px;">
<div class="column" style="width:50%"><ul>
<li><a href="#" title="">Firefox</a></li>
<li><a href="#" title="">Internet Explorer</a></li>
<li><a href="#" title="">Opera</a></li>
</ul></div>
<div class="column" style="width:50%"><ul>
<li><a href="#" title="">Safari</a></li>
<li><a href="#" title="">Google Chrome</a></li>
<li><a href="#" title="">Konqueror</a></li>
</ul></div></div>
</li>
<li><a href="#" title="">CSS3 Info</a></li>
</ul></div></div>
</li>
<li class="topmenu"><a href="#" title=""><span>SAMPLES</span></a>
<div class="submenu" style="width:441px;">
<div class="column" style="width:33.33%"><ul>
<li><a href="#" title="">Android Template</a></li>
<li><a href="#" title=""><span>Blocks Template</span></a>
<div class="submenu" style="width:342px;">
<div class="column" style="width:50%"><ul>
<li><a href="#" title="">Blue Theme</a></li>
<li><a href="#" title="">Green Fodder Theme</a></li>
<li><a href="#" title="">Grey Theme</a></li>
</ul></div>
<div class="column" style="width:50%"><ul>
<li><a href="#" title="">Light Theme</a></li>
<li><a href="#" title="">Orange Theme</a></li>
<li><a href="#" title="">Purple Theme</a></li>
</ul></div></div>
</li>
<li><a href="#" title="">Elegant Template</a></li>
</ul></div>
<div class="column" style="width:33.33%"><ul>
<li><a href="#" title="">Frame Template</a></li>
<li><a href="#" title="">Fresh Template</a></li>
<li><a href="#" title="">Mac Template</a></li>
</ul></div>
<div class="column" style="width:33.33%"><ul>
<li><a href="#" title=""><span>Neon Template</span></a>
<div class="submenu" style="width:266px;">
<div class="column" style="width:50%"><ul>
<li><a href="#" title="">Green Theme</a></li>
<li><a href="#" title="">Liliac Theme</a></li>
<li><a href="#" title="">Blue Theme</a></li>
</ul></div>
<div class="column" style="width:50%"><ul>
<li><a href="#" title="">Neon Theme</a></li>
<li><a href="#" title="">Orange Theme</a></li>
</ul></div></div>
</li>
<li><a href="#" title="">New Templates</a></li>
</ul></div></div>
</li>
<li class="topmenu"><a href="#" title="">DOWNLOAD</a></li>
</ul>
* Now click to save your HTML/javascript and after saving this element Drag and drop below header and again click to save button ok.
No comments:
Post a Comment