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

Avoid to use ENUM and SET type in MySQL

Posted on 6 years ago

Bhumi

To learn MySQL PACK_KEYS with example

Posted on 3 years ago

Bhumi

How to set 301 Redirection in PHP

Posted on 3 years ago

Bhumi

The Reader’s Poll – June 2015

Posted on 2 years ago

Bhumi

The Reader’s Poll – August 2014

Posted on 3 years ago

Bhumi

The Reader’s Poll – June 2014

Posted on 3 years ago

Bhumi

The Readers’ Poll – May 2014

Posted on 4 years ago

Bhumi

The Readers’ Poll – August 2013

Posted on 4 years ago

Bhumi