Back to Top

How to Accordion Menu with Modx

Modx, a popular content Management Framework which comes with a vast directory of useful packages.Wayfinder is a Snippet basically used to create navigational menus in Modx.

So I am going to write a detailed tutorial about the vertical accordion menu in Modx Revolution with the use of Wayfinder package. You just need to follow very simple steps to create your accordion menu in Modx.

So, Here are the detailed steps:

Also Read: Execute Custom Query IN MODx

Step 1:

Let’s start with the Wayfinder code, Here we call Wayfinder snippet for displaying menu.To place below code into the template.

Step 2:

Now it is time to call JavaScript which is very useful to create an accordion effect with the menu.To add Javascript code, create one new chunk with the name ‘wfJS’ and add below code in it.

Step 3:

Next is to implement CSS.To use CSS create one more chunk with title ‘wfCss’ and place below code in it.

Must Read: Execute Custom Query IN MODx

When We have successfully done the above steps, It’s time to see it in action.I hope you have learned a bit and don’t forget to write your valuable comments.

Thanks for reading and feel free to share your thoughts! Don’t Forget to Follow us on Twitter or Subscribe us to Get the Latest Updates.

Leave a Reply

Your email address will not be published. Required fields are marked *

Most Popular Posts

Learn about InnoDB MySQL Storage Engine

Posted on 6 years ago


How to Lock File in PHP

Posted on 6 years ago


What is Wpautop() function in WordPress

Posted on 2 years ago


How to use MySQL Event Scheduler

Posted on 1 year ago


How to use Git init command

Posted on 7 months ago