How to Add a Top Sidebar to a Minima Stretch Template for New Blogger?

This blog is using Minima Stretch template. I have customized the look of this blog a lot. Now I want to add a top sidebar to this template. How can that be done? Actually it is not so hard than I thought. The following steps describe how I've accomplished this task.

• Always backup your template before you do anything. Go to http://www.blogger.com/home. Click on a down arrow that will show more options. See the screenshot below:
  
• A list of choices will show up. Click on Template. See the screenshot below:
  
• It will lead you to the next screen. On the upper right corner, click on Backup/Restore. See the screenshot below:
  
• Next a popup window will appear. Click on an orange button Download full template to save your file to your PC. See the screenshot below:
  
• After that close the popup window. Next click on Edit HTML. See the screenshot below:
  
• Another popup window will open. It will allow you to edit your html. See the screenshot below:
  
• Next hold Ctrl and hit F at the same time to bring up a search bar. Type #sidebar-wrapper { in the text field to find the following code:
  

  #sidebar-wrapper { width: 160px; margin-right: 15px; float: right; overflow: hidden; /* fix for long non-text content breaking IE sidebar float */ }

• Next add the following code above it. See it in red below:
  

  #topsidebar-wrapper { width:330px; //pick your own width here float: top; overflow: hidden; /* fix for long non-text content breaking IE sidebar float */ } #sidebar-wrapper { width: 160px; margin-right: 15px; float: right; overflow: hidden; /* fix for long non-text content breaking IE sidebar float */ }

• Then hold Ctrl and hit F at the same time again. Type <div id='sidebar-wrapper'> in the text field to find the following code:
  

  <div id="sidebar-wrapper"> <b:section class='sidebar' id='sidebar' preferred='yes'/> </div>

• Add the following code above it. See it in red below:
  

  <div id='topsidebar-wrapper'> <b:section class='sidebar' id='topsidebar' preferred='yes'/> </div> <div id="sidebar-wrapper"> <b:section class='sidebar' id='sidebar' preferred='yes'/> </div>

• Finally click on an orange button Save template to save it. See the screenshot below:
  

In order to understand the above steps, you must read How to Expand Your Minima Strech Template? before you apply these steps. Otherwise some parts maybe confusing and you may not understand it. Anyway would you like to add a top sidebar to your Minima Stretch template? Tell us why or why not in our comment section.