ব্লগে Leftmenu বা Sidebar তৈরি করুন 


[ছবি: 8xDEn.png]
প্রথমে আপনি আপনার ব্লগে লগিন করুন এবং ডিজাইনে ক্লিক করুন
তারপর আপনার পছন্দ মত যে যায়গায় আপনি গ্যাজেট যুক্ত করতে চান সেই জায়গায় ক্লিক করুন তারপর HTML/JavaScript এর ঘরে কোড গুলো কপি করে পেস্ট করুন
<div id="staticmenu" style="right: 10px; top: 100px">
<ul>
<li><a href="http://www.torrentsbd.com/">বাংলা ফোরাম টরেন্টসবিডি.কম</a></li>
<li><a href="http://www.torrentsbd.com/forumdisplay.php?fid=46">হ্যাকিং এবং ভাইরাস</a></li>
<li><a href="http://www.torrentsbd.com/forumdisplay.php?fid=6">কম্পিউটার বিষয়ক</a><a href="http://www.torrentsbd.com/forumdisplay.php?fid=10">মোবাইল</a></li>
<li><a href="http://www.torrentsbd.com/forumdisplay.php?fid=11">বিজ্ঞান ও প্রযুক্তি</a></li>
<li><a href="http://www.torrentsbd.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>


# সেভ করার আগে উপরের কোড অংশটুকুতে তিনটি বিষয় পরিবর্তন করে নিন।
# style=left: 10px; এখানে left বদলে right লিখে দিলে মেনুটি ব্লগের শরীরের ডানপাশে থাকবে।
# top: 20px এর পরিবর্তে 100 বা 200 যেকোন সংখ্যা লিখে দিলে উপর থেকে নিচের দিকে ঠিক সেই জায়গায় থাকবে।
#http://www.torrentsbd.com ও বাংলা ফোরাম টরেন্টসবিডি.কম, মোবাইল বিজ্ঞান ও প্রযুক্তি এই গুলো পরিবর্তন করে নিজের প্রয়োজনীয় লিংক ও তার নাম লিখে দিন।
#সেভ করার পর চলে যান Layout > Edit HTML অংশে।
# এখানে Expand Widgets Templates এর পাশের চেকবক্সে টিকচিহ্ন দিতে হবে না।
# HTML কোডের মাঝামাঝি ]]></b:skin> লেখাটি খুঁজে বের করুন।
# এই লেখাটুকু সম্পূর্ণ মুছে দিন।
# লেখাটি যে জায়গায় ছিল ঠিক সেই জায়গায় নিচের কোডটুকু স্থাপন করুন।
.wireframemenu{
margin-top:20px;
border: 1px solid #C0C0C0;
background-color: #ffffff; /*#B93B8F*/
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; /*#1589FF*/
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 http://www.javascriptkit.com/ for this script and 100s more
* Modified by: http://www.banglahacks.com
***********************************************/
//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>

*PREVIEW দেখে নিন। পছন্দ হলে সেভ করুন

0 comments :

Post a Comment

সফিক গ্রাফিক্স
মেলান্দহ বাজার, জামালপুর।

 
How to Lose Weight at Home Top