Create a vertical accordian menu for blogger

If you want to add a navigation menu, with hovering effect and drop down menu capability in blogger blog to give it a more website like feel, this is how you do it.
 The menu we are going to add looks like the one in my home page.
Now ,as with any customisation this too has two parts
  1. A CSS edit and
  2. The real code 
The CSS code ;  To define the appearance we have to add the following code to the style sheet , just before the style sheet declaration ends. Search for "]]" in the browser.Now copy the following code preceding the red line and paste it before the ]] < /b:skin >

Now Save the template.

2. Adding the code.
                              You may add the code as widget or as HTML in the code editor window. I would recommend the widget since it will be easier to maintain in the long run. Do the following steps
  1. Add the HTML widget in blogger
  2. Copy the following piece of code on it and add whatever content you want in the blue regions provided.The code is self explanatory and simple I think. You may remove the comments if you don't want them

Now you save the widget and save the template. Your new web template with drop down menu is ready !!

If you find any bugs in this do let me know. I have tested it in my own website and it looks perfectly OK ..

Spread The Love, Share Our Article

Related Posts

6 Response to Create a vertical accordian menu for blogger

April 29, 2011

Wow this menu worked perfectly well for me

May 14, 2011

 Hy i acnt found this code in my template  ]]
What is the second option of to add in my blogger? reply me

July 27, 2011

try the above line

April 13, 2012

bạn ơi cho mình hỏi. có bảng menu nào y như vậy. mà dùng cho blogspot được không.
mình nhìn menu này rất là đẹp có gì bạn trả lời qua mail dùm mình nha. cảm ơn ban rất nhiều

April 13, 2012

Sorry hoàng phước. English please

April 13, 2012

I embedded the code into the blogspot and do so that it does not show. How you can help me.
vertical accordian menu. looked good. thank you in advance dental.

hoang phuoc

Post a Comment