ලස්සන SideBar එකක් බ්ලොගියට දාගන්න.

මතු දාක කාසී නිසා.. නෑ නෑ මුකුත් නෑ. අද මාර නිදහසක් දැනෙන්නේ ඕයි.අද වගේ දවසක තමා සුදු මාමලාගෙන් අපේ රට හෙවත් මගේ රට මුදාගත්තේ.මගේ රට කිවුවේ මගෙ නිසයි හොදේ.කවුරුත් අල්ලන්න ආවොත් දන්නවනේ.(විහිලුවක් කලේ හොදේ) හලි හලි අද ක්ලාසුත් නෑ ගෙදර ඉන්නවා අප්පා.. කම්මැලියේ බෑ.. හා කමක් නැද්ද, කමක් නෑ ආසාවනේ. (මේකට පිස්සු හැදිලා කියලා හිතනවද දන් නෑ.)

අද ගෙනාවේ බ්ලොගින් ගැන පොස්ටුවක්!! හොටු පෙරාගන්නේ නැතිව බලන්ටකෝ.. මේකනම් පස්ට එකක්. බ්ලොගියේ අනිත් ඒවා ඉහල පහල යද්දි මේක විතරක් ගලක් වගේ ඉන්නකොට කොහොමද ආතල් එක. කීන් ගානවා අප්පා..

මෙහෙමයි හරිම සිම්පල් ප්ලෑන් එකක් අයියෝ.. පහල තියෙන කෝඩ් එක HTML/Java Script එකක් ඇරන් සෙව් කරගන්න.

Code:
<script src="http://dl.dropboxusercontent.com/s/dxv8pj5mvc74vyw/prototype.js" type="text/javascript"></script>    <script src="http://dl.dropboxusercontent.com/s/wvyae56sr0hic2n/effects.js" type="text/javascript"></script>    <script src="http://dl.dropboxusercontent.com/s/8t6uvuz6r1xzpnz/side-bar.js" type="text/javascript"></script>    <a href="#" target="_blank" title="wadiyalk"><img src="https://bitly.com/24workpng1" alt="Blogger Tips and Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="#" target="_blank" title="Latest Tips And Tricks"><img src="https://bitly.com/24workpng1" alt="Latest Tips And Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="#" target="_blank" title="Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="Blogger Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a>    <style>    body{    font-size:75%;    }    a{    outline: none;    }    a:active{    outline: none;    }    #sideBar{    text-align:left;    }    #sideBar h2{    color:#F0FFFF;    font-size:110%;    font-family:arial;    margin:10px 10px 10px 10px;    font-weight:bold !important;    }    #sideBar h2 span{    font-size:125%;    font-weight:normal !important;    }    #sideBar ul{    margin:0px 0px 0px 0px;    padding:0px 0px 0px 0px;    }    #sideBar li{    margin:0px 5px 5px 10px;    padding: 0 0 0 10px;    list-style-type:none;    display:block;    background-color:#DA1074;    width:177px;    color:#FFFFFF;    }    #sideBar li a{    width:100%;    }    #sideBar li a:link,    #sideBar li a:visited{    color:#FFFFFF;    font-family:verdana;    font-size:100%;    text-decoration:none;    display:block;    margin:0px 0px 0px 0px;    padding:0 0 0 20px;    width:100%;    }    #sideBar li a:hover{    color:#FFFF00;    text-decoration:underline;    }    #sideBar{    position: fixed;    width: auto;    height: auto;    top: 200px;    left:0px;    background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhCfVFUE4zk4lVh8PfL94punrXUWn62a_LWhO20bzfXLSn29B1znXevAZ8MOeysroA7SfK_41KPowGHjwnigdvR3dwPPMOxjHnvOl3N6n67Ln8K59gOpPEGBW1Y7OG0Uos6d36rzwuzzC1N/s320/left.collapse.border.png);    background-position:top right;    background-repeat:repeat-y;    }    #sideBarTab{    float:left;    height:137px;    width:28px;    }    #sideBarTab img{    border:0px solid #FFFFFF;    }    #sideBarContents{    float:left;    overflow:hidden !important;    width:200px;    height:320px;    }    #sideBarContentsInner{    width:200px;    }</style>    <div id="sideBar">    <div id="sideBarContents" style="display:none;">    <div id="sideBarContentsInner">    <h2>Left<span>Menu</span></h2>    <ul>    <li><a href="https://www.facebook.com/syberlk">Home  </a></li><li><a href="https://plus.google.com/+HasunChathu">1 Title </a></li><li><a href="http://syberlk.com/">2 Title</a></li><li><a href="https://twitter.com/syberlk">3 Title</a></li><li><a href="https://www.facebook.com/syberlk">4 Title</a></li><li><a href="https://plus.google.com/+HasunChathu" 5 title</a></li><li><a href="http://syberlk.com/">6 Title</a></li><li><a href="https://twitter.com/syberlk">7 Title</a></li>    </ul>    </div> </div>    <a id="sideBarTab" href="#"><img alt="sideBar" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiT3I-tLlTNKs1eZn6eR_OjwznKWnAjmXOblVjcaIe_40dbqoOUzzCeoJfNtHf9A9YvZTc87-bePEWr0y_Rdu1lpdx1KoGu61Zmhjk380vFJ87EnN6sKFE1vUKC1SemtOSpPsgEmIM8TTuk/s320/sidebarcollapse.png" title="sideBar" /></a>    </div>

සප්පා.. හලි ඕන්.ඔය පාට පාටින් දාලා තියෙන ඒවා Edit කරගන්න ඈ.

<li><a href="http://syberlk.com/">2 Title</a></li><li><a href="https://twitter.com/syberlk">3 Title</a></li><li><a href="https://www.facebook.com/syberlk">4 Title</a></li><li><a href="https://plus.google.com/+HasunChathu" 5 title</a></li><li><a href="http://syberlk.com/">6 Title</a></li><li><a href="https://twitter.com/syberlk">7 Title</a></li>