Create your blogspot and blog on the left side for close menu

First, log in to your blog.

Then Design>> Add a Gadget> HTML/Javascript to add the following code to save.

<script src="http://sites.google.com/site/banglahacks/shrd/prototype.js" type="text/javascript"></script> <script src="http://sites.google.com/site/banglahacks/shrd/effects.js" type="text/javascript"></script> <script src="http://sites.google.com/site/banglahacks/shrd/side-bar.js" type="text/javascript"></script> <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: 140px; left:0px; background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi8YAugV4C7-Ft-Rq-5W6MaVpk1vAcJshFQVxLNoyjhKqdshYCNOX0N1gmkpSCqEylRPzG2A6o49HyXZSmZpLcayg8Qbx0thaekxW17aZ6xdE_-cjcsJT-MyQrmyPq-ExQEh3I7Jvc_mtBb/s320/left.collapse.border.gif); 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="#">Link One</a></li> <li><a href="#">Link Two</a></li> <li><a href="#">Link Three</a></li> <li><a href="#">Link Four</a></li> </ul> </div> </div> <a id="sideBarTab" href="#"><img alt="sideBar" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYtOsyUfRmVl2DrCvnPWPfxz_ss6iEA-_cPUF0w6V_uJw-yxK5YwqQ7SFv9ClnYugOhgJzNAdFi6u4U324lMpPSr6K4_UdKkfMe-YHxc_tXIWMeBQoJuMXrspvCPIuCZ1-JopgBSU-5PP1/s320/sidebarcollapse.gif" title="sideBar" /></a> </div>

finish your work.