Saturday, 15 February 2014

How to create a Beautiful Accordion Menu in Pure CSS??

Hey Fellas.Today's tutorial is about creating an accordion menu in pure CSS.I have seen many accordion menus ,often comes packed with javascript.But javascripts are dangerous .They can increase the loading time of your blog massively.And  such accordion menu would precisely never load on browsers that have disabled javascript or on low end browsers.the solution to all the problem is to make an accordion menu in complete CSS.


This stylish accordion menu can easily be used for Wordpress sites as well as sites hosted on blogger.This doesn't increase the load on your website and it works on HTML5 so that it  can easily be customised.

Stylish Elegant cool, accordion mney for wordpress and blogger

Features-HTML 5 Css Accordion Menu


  • Stylish and elegant.
  • HTML 5 Compatible
  • Accordion Menu Easily integrates with Wordpress & Blogger
  • Simple and Clean code
  • Pure CSS




See the Pen Pure Css Accordion Menu by Anz Joy (@anzjoy) on CodePen.




Deploying the Accordion menu in Blogger Blogs

Search the following code in blogger template editor

]]></b:skin>

And Copy-paste the css content from the codepen above (before) the searched code
Now copy the HTML form the code pen
Go to Blogger layouts - Add html/javascript widget-Paste the copied HTML content.
You are Good to go.Have a cup of coffee.

Search Terms

Stylish Accordion Menu for wordpress
Stylish accordion for blogger
Cool accordion menu

2 comments :

DesignerzBlog Theme | Designed by Anz Joy