How to make Leftmenu or Sidebar

 

প্রথমে আপনি আপনার ব্লগে লগিন করুন এবং ডিজাইনে ক্লিক করুন
তারপর আপনার পছন্দ মত যে যায়গায় আপনি গ্যাজেট যুক্ত করতে চান সেই জায়গায় ক্লিক করুন তারপর HTML/JavaScript এর ঘরে কোড গুলো কপি করে পেস্ট করুন

</div>

<div><code><div id="staticmenu" style="right: 10px; top: 100px">

 <ul>

 <li><a href="http://www.music2radio.blogspot.com/">বাংলা ফোরাম টরেন্টসবিডি.কম</a></li>

 <li><a href="http:// www.music2radio.blogspot.com /forumdisplay.php?fid=46">হ্যাকিং এবং ভাইরাস</a></li>

 <li><a href=" www.music2radio.blogspot.com /forumdisplay.php?fid=6">কম্পিউটার বিষয়ক</a><a href="http:// www.music2radio.blogspot.com /forumdisplay.php?fid=10">মোবাইল</a></li>

 <li><a href=" www.music2radio.blogspot.com /forumdisplay.php?fid=11">বিজ্ঞান ও প্রযুক্তি</a></li>

 <li><a href="http:// www.music2radio.blogspot.com /forumdisplay.php?fid=47">মনের জানালা </a></li>

 <li><a href="http://feedburner.google.com/fb/a/mailverify?uri=bhacks&loc=en_US">Subscribe</a></li>

 </ul>

 </div></code></div>

<div>

• সেভ করার আগে উপরের কোড অংশটুকুতে তিনটি বিষয় পরিবর্তন করে নিন।
• style=left: 10px; এখানে left বদলে right লিখে দিলে মেনুটি ব্লগের শরীরের ডানপাশে থাকবে।
• top: 20px এর পরিবর্তে 100 বা 200 যেকোন সংখ্যা লিখে দিলে উপর থেকে নিচের দিকে ঠিক সেই জায়গায় থাকবে।
• http:// www.music2radio.blogspot.com ও বাংলা ফোরাম টরেন্টসবিডি.কম, মোবাইল বিজ্ঞান ও প্রযুক্তি এই গুলো পরিবর্তন করে নিজের প্রয়োজনীয় লিংক ও তার নাম লিখে দিন।#সেভ করার পর চলে যান Layout > Edit HTML অংশে।
• এখানে Expand Widgets Templates এর পাশের চেকবক্সে টিকচিহ্ন দিতে হবে না।
• HTML কোডের মাঝামাঝি ]]></b:skin> লেখাটি খুঁজে বের করুন।
• এই লেখাটুকু সম্পূর্ণ মুছে দিন।

• লেখাটি যে জায়গায় ছিল ঠিক সেই জায়গায় নিচের কোডটুকু স্থাপন করুন।

</div>

.wireframemenu{

 margin-top:20px;

 border: 1px solid #C0C0C0;

 background-color: #ffffff; /*Background color*/

 width: 115px;

 position: absolute;

 }

* html .wireframemenu{ /*IE only rule. Original menu width minus all left/right paddings */

 width: 164px;

 }

.wireframemenu ul{

 padding: 4px 3px;

 margin: 0;

 list-style-type: none;

 }

.wireframemenu a{

 font: 14px Verdana;

 padding: 4px 3px;

 display: block;

 width: 100%; /*Define width for IE6's sake*/

 color: #ff0000; /*Link Color*/

 text-decoration: none;

 border-bottom: 1px solid #C0C0C0;

 }

.wireframemenu a:visited{

 color: #595959;

 }

html>body .wireframemenu a{ /*Non IE rule*/

 width: auto;

 }

.wireframemenu a:hover{

 color: #0000ff;

 border-right:2px solid black;

 }

]]></b:skin>

<script type='text/javascript'>

 //<![CDATA[

/***********************************************

 * Static Menu script- by JavaScript Kit (www.javascriptkit.com)

 * This notice must stay intact for usage

 * Visit JavaScript Kit at <a target="_blank" href="http://www.javascriptkit.com/" onclick="javascript:_gaq.push(['_trackEvent','outbound-article','http://www.javascriptkit.com/']);">http://www.javascriptkit.com/</a> for this script and 100s more

 * Modified by: <a target="_blank" href="http:// www.music2radio.blogspot.com " onclick="javascript:_gaq.push(['_trackEvent','outbound-article','http:// www.music2radio.blogspot.com ']);">http:// www.music2radio.blogspot.com </a>

 ***********************************************/

//ids of menus to keep static on page (must be absolutely positioned, with left/top attribute added inline inside tag)

 //Separate multiple ids with a comma (ie: ["menu1", "menu2"]

 var staticmenuids=["staticmenu"]

var staticmenuoffsetY=[]

function getmenuoffsetY(){

 for (var i=0; i<staticmenuids.length; i++){

 var currentmenu=document.getElementById(staticmenuids[i])

 staticmenuoffsetY.push(isNaN(parseInt(currentmenu.style.top))? 0 : parseInt(currentmenu.style.top))

 }

 initstaticmenu()

 }

function initstaticmenu(){

 var iebody=(document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body

 var topcorner=(window.pageYOffset)? window.pageYOffset : iebody.scrollTop

 for (var i=0; i<staticmenuids.length; i++)

 document.getElementById(staticmenuids[i]).style.top=topcorner+staticmenuoffsetY[i]+"px"

 setTimeout("initstaticmenu()", 100)

 }

if (window.addEventListener)

 window.addEventListener("load", getmenuoffsetY, false)

 else if (window.attachEvent)

 window.attachEvent("onload", getmenuoffsetY)

//]]>

</script>

*উপরের কোডে আমি /*Background Color*/ এবং /*Link Color*/ লেখাগুলোকে কালার কোড বসিয়ে নিবেন



If you face any problem in this post please let me know your problem. To inform your problem you can leave a comment below. And if you like my post please click the Facebook like button or spread this post by clicking the Twitter, Facebook etc. icons below. Because, it will be a great support for me.