আপনার blogspot blog এ ড্রপ ডাউন menu add করুন

উপরের ছবির মত একটি মেন্যু বার এড করতে …
নিচের ধাপগুলো অনুসরণ করুন:
১. Layout->Edit Html এ যান
২.  ctrl+F দিয়ে নিচের কোড খুজে নিন:  </head>
৩. উপরের কোডের পর নিচের কোডটুকু পেস্ট করুন
<style>
#sddm
{ margin: 0;
padding: 0;
z-index: 30}
#sddm li
{ margin: 0;
padding: 0;
list-style: none;
float: left;
/*Font of menu top*/
font: bold 11px arial}
#sddm li a
{ display: block;
margin: 0 1px 0 0;
padding: 4px 10px;
/*width of each menu top*/
width: 60px;
/*background color of main menu*/
background: #5970B2;
/*text color of main menu*/
color: #FFFFFF;
text-align: center;
text-decoration: none}
#sddm li a:hover
{
/*background color of main menu on hover*/
background: #49A3FF}
#sddm div
{ position: absolute;
visibility: hidden;
margin: 0;
padding: 0;
/*background color of drop down menu */
background: #FFFFFF;
/*border of the drop down menu*/
border: 1px solid #5970B2}
#sddm div a
{ position: relative;
display: block;
margin: 0;
padding: 5px 10px;
width: auto;
white-space: nowrap;
text-align: left;
text-decoration: none;
/*background color of each menu element*/
background: #FFFFFF;
/*text color of each menu element*/
color: #2875DE;
/*font of each menu element*/
font: 11px arial}
#sddm div a:hover
{
/*background of each element on hover*/
background: #49A3FF;
/*font color of each menu item on hover*/
color: #FFFFFF}
</style>
<script type=’text/javascript’>
var timeout = 500;
var closetimer = 500;
var ddmenuitem = 0;
// open hidden layer
function mopen(id)
{
// cancel close timer
mcancelclosetime();
// close old layer
if(ddmenuitem) ddmenuitem.style.visibility = ‘hidden’;
// get new layer and show it
ddmenuitem = document.getElementById(id);
ddmenuitem.style.visibility = ‘visible’;
}
// close showed layer
function mclose()
{
if(ddmenuitem) ddmenuitem.style.visibility = ‘hidden’;
}
// go close timer
function mclosetime()
{
closetimer = window.setTimeout(mclose, timeout);
}
// cancel close timer
function mcancelclosetime()
{
if(closetimer)
{
window.clearTimeout(closetimer);
closetimer = null;
}
}
// close layer when click-out
document.onclick = mclose;
</script>
৪. মেনু যুক্ত করা: প্রথমে Layout>Page Elements এ যান । এবার Add Gadget এ ক্লিক করুন । HTML/JAVASCRIPT সিলেক্ট করুন এবং নিচের কোডটুকু সংযুক্ত করুন
<ul id=”sddm”>
<li><a href=”#”
onmouseover=”mopen(‘m1′)”
onmouseout=”mclosetime()”>Home</a>
<div id=”m1″
onmouseover=”mcancelclosetime()”
onmouseout=”mclosetime()”>
<a href=”#”>HTML Drop Down</a>
<a href=”#”>DHTML Menu</a>
<a href=”#”>JavaScript DropDown</a>
<a href=”#”>Cascading Menu</a>
<a href=”#”>CSS Horizontal Menu</a>
</div>
</li>
<li><a href=”#”
onmouseover=”mopen(‘m2′)”
onmouseout=”mclosetime()”>Download</a>
<div id=”m2″
onmouseover=”mcancelclosetime()”
onmouseout=”mclosetime()”>
<a href=”#”>ASP Dropdown</a>
<a href=”#”>Pulldown menu</a>
<a href=”#”>AJAX Drop Submenu</a>
<a href=”#”>DIV Cascading Menu</a>
</div>
</li>
<li><a href=”#”>Order</a></li>
<li><a href=”#”>Help</a></li>
<li><a href=”#”>Contact</a></li>
</ul>
<div style=”clear:both”></div>
Note: # চিহ্নিত যায়গায় মেনুটির লিংক দিন এবং পাশের নাম গুলো আপনার ইচ্ছা মত দিন এবং save করুন ।
html code টি আপনার ইচ্ছামত drag করে সরিয়ে মেন্যু জায়গা পরিবর্তন করতে পারবেন । ধন্যবাদ ।