ModX Revolution: sortby folder menuindex then element menuindex

2 min read 06-10-2024
ModX Revolution: sortby folder menuindex then element menuindex


Mastering Menu Order in MODX Revolution: Sorting by Folder and Element Index

Problem: You're using MODX Revolution's powerful menu system to structure your website navigation, but you need more granular control over the order of your menu items. Specifically, you want to sort menu items first by their folder order and then by the order of individual elements within each folder.

Rephrased: Imagine you have a website with a "Services" menu that contains sub-menus for "Web Design," "SEO," and "Marketing." You want to ensure that these sub-menus appear in the order "Web Design," "SEO," and "Marketing," and then that the individual elements within each sub-menu are also ordered as desired. This article will show you how to achieve this using MODX Revolution's built-in features.

Scenario and Original Code:

Let's say you have the following folder structure in your MODX Resource Tree:

  • Services
    • Web Design
      • Resource 1
      • Resource 2
      • Resource 3
    • SEO
      • Resource 4
      • Resource 5
    • Marketing
      • Resource 6

You've set the "Menu Index" of each folder and Resource as follows:

Resource Menu Index
Services 1
Web Design 1
SEO 2
Marketing 3
Resource 1 1
Resource 2 2
Resource 3 3
Resource 4 1
Resource 5 2
Resource 6 1

However, when you view the website, the menu doesn't display in the desired order. This is because MODX typically prioritizes the "Menu Index" of the Resource itself, not its parent folder.

The Solution: Using "Sortby" and "Menuindex"

MODX Revolution offers a powerful solution using the "Sortby" setting in your Snippet or Template. Here's how to achieve the desired folder-then-element sorting:

  1. Modify Your Snippet or Template: Within your Snippet or Template that generates your menu, add the following line to the sortby parameter:
'sortby' => '[[*parent]] ASC, [[*menuindex]] ASC'
  1. Explanation:
    • [[*parent]] ASC: This part sorts by the parent resource ID in ascending order. This ensures that folders are sorted correctly first.
    • [[*menuindex]] ASC: This part then sorts by the menuindex of each individual Resource in ascending order.

Why This Works:

  • Hierarchical Sorting: The [[*parent]] ASC part tells MODX to first sort by the parent Resource ID. This groups elements within the same folder.
  • Element Ordering: Once grouped by folders, the [[*menuindex]] ASC part then sorts the elements within each folder by their individual "Menu Index" values.

Additional Tips:

  • Descending Order: To sort in descending order, replace ASC with DESC.
  • Complex Sorting: You can combine multiple sorting criteria using commas.
  • Advanced Features: MODX also provides advanced features like custom sorting using Snippets or custom filters for more complex ordering scenarios.

Benefits:

  • Control over Menu Order: You gain full control over the order of your menu items, creating a logical and consistent navigation experience for your users.
  • Improved User Experience: By ensuring a well-organized and predictable menu structure, you enhance user navigation and website usability.

Resources:

Conclusion:

By mastering the sortby and menuindex settings in MODX Revolution, you can achieve a highly customizable menu order that suits your exact needs. This provides a robust way to manage navigation structure and deliver a superior user experience.