8 Simple Css Vertical menu bar for blogger

8 Simple Css Vertical menu bar for blogger

Sharing The first collection of Vertical Navigation menu bar for blogger. Today I give you some awesome designed vertical menu. This menu bar designed by Cssmenumekar. I am modify these and make comfortable for your blogger site. I am tried hard to share the best menu bar for you. Hope you like and enjoy this.

How to add Vertical Navigation CSS Menu on your blogger/blogspot site

1.To add any menu bar from below first copy the css code of your selected menu.
2.Then go to your blogger template and find ]]></b:skin>
3.Past your copied css code just above of ]]></b:skin>
4.Now save your template.




After adding css code now you need to add html code to show your menu bar on blogger.

1. Go to your blogger layout option> Add a gadget > Html/javascript > and paste the html codes and save it.
2. Now you need to edit the html codes:

   <li><a href='#'><span>Home</span></a></li>
   <li><a href='#'><span>Products</span></a></li>
   <li><a href='#'><span>Menu 1</span></a></li>
   <li><a href='#'><span>Menu 2</span></a></li>
   <li><a href='#'><span>About</span></a></li>
   <li><a href='#'><span>Contact</span></a></li>

Remove # and give your page url and change Home, Products, Contact etc and give the linked page name on it.

Note: if the menu is not fitted on your slide bar actual size then simply comment on the bottom. I will try to made it comfortable with your site.

---

1. Blue & White Menu

---

CSS CODE:

HTML CODE:

---

2. Black & Yellow Menu

---

CSS CODE:

HTML CODE:

---

3. Black & Blue Menu

---

CSS CODE: 

HTML CODE:

---

4. Red & White Menu

---

CSS CODE:

HTML CODE:

---

5. Vertical-Massive-Blue

---

CSS CODE:

HTML CODE:

---

6.Grey Hat Menu

---

CSS CODE:

HTML CODE:

---

7. Bitbox Menu

---

CSS CODE: 

HTML CODE:

---

8.Salmon Menu

---

CSS CODE: 

HTML CODE: