In one of my previous blog entries, I gave a brief explanation on how to create an accordion navigation menu. Someone commented on that article asking me how to open up multiple panels and remember the state (expanded or collapsed) of each panel. Since these two requirements are not related to the concept of an accordion navigation, I decided to write this separate article on how to create a vertical collapsible navigation menu. The end result can be seen here.

Step 1: create a custom list template

Navigate to the template section of your current theme and create a list template from scratch. Assign it a name and a custom theme class. Then, edit the list template and copy and paste the following code snippets in the appropriate sections.