Add drop down menu in blog

Adding drop down menus in blogger can benefit your readers to find out the intended posts of the blog with ease. To add drop down menu in blogger you need is just a little bit of CSS and HTML code

1. HTML

Click on Add a Gadget > HTML/JavaScript link and insert the following type of code

<div id="navigation">

  <ul>

    <li><a href="#">Home</a></li>

    <li><a href="#">About</a></li>

    <li><a href="#">Services</a>

      <ul>

        <li><a href="#">Web design</a></li>

        <li><a href="#">Wordpress</a></li>

      </ul>

     </li>

    <li><a href="#">Contact</a></li>

  </ul>

</navigation>

2. CSS

                Now Navigate to Design > Edit HTML Section. Find this type of code ]]></b:skin> and put this code before it

Add Smooth Scroll To Top Button To Blogger

This is one of cool trick for blogger to create a smooth scroll to top. If you have lot of content on you blog pages, and if you want to make your blog to be easy to navigate for your readers, a back to top button will make it easy and perfect.
Steps:

Step 1: Log on your blogger account and Go to, Dashboard >> Layout >> Edit html.

Step 2: Now find the following tag by using "Ctrl + F".

]]></b:skin>

Step 3: Copy and Paste below code before the above tag.

#backtotop {

padding:5px; 

position:fixed; 

bottom: 5px; 

right: 5px; 

cursor:pointer;

}

Step 4: Now find the </body> tag by using "Ctrl + F" and copy and paste below code before the </body> tag.

<a href="#" id="backtotop"><img src="Image Url" alt="back to top" /></a>

Step 5: Now select your free back to top button in the below list and copy and paste it’s Image URL in to the place of "Image Url" of above code.

Step 6: Find the <head> tag by using "Ctrl + F" and copy and paste below code after the <head> tag.

<!-- start back to top -->

&lt;script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js'

type='text/javascript'&gt;&lt;/script&gt;

&lt;script language=&quot;javascript&quot;&gt;

$(window).ready(function(){

$('#backtotop').click(function(e){

e.preventDefault();

$('html, body').animate({scrollTop:0}, 'slow');

});

});

&lt;/script&gt;

<!-- end back to top -->

Step 7: Finally “Save Template".