We launched new forums in March 2019—join us there. In a hurry for help with your website? Get Help Now!
    • 36098
    • 46 Posts
    Hi,

    I try to use this menu : http://subran.be/testmenu/ into my Modx Website but I can't get it working with Wayfinder.

    Wayfinder uses <ul>and<li> and in that menu it uses <div>...

    I think it's possible but I'm stuck sad
      • 28042 ☆ A M B ☆
      • 24,524 Posts
      I would recommend using a more standard list-based menu that does the same thing. Like this one

      http://www.alistapart.com/articles/hybrid/
      http://www.alistapart.com/d/hybrid/hybrid-4.html
        Studying MODX in the desert - http://sottwell.com
        Tips and Tricks from the MODX Forums and Slack Channels - http://modxcookbook.com
        Join the Slack Community - http://modx.org
        • 39932
        • 483 Posts
        @Subran:

        I think it's possible but I'm stuck..

        You are absolutely correct. All you have to do is create the outer, inner and row Chunks that do what you want. However, @sottwell is correct. Menus are better as lists for a number of reasons:


        • They are semantic HTML, and therefore easier for screen-readers
        • They are block elements, just like a div.
        • CSS allows your to do anything with a list that you could do with a div.
        • They are easier to style with CSS. A ul inside an li is easier to find than a div in a div in a div. And in many div menus there are far more divs than just the 3 I listed.
        • They generally perform faster.
        • They generally result in less code ->smaller requests -> faster loads,
          Website: Extended Dialog Development Blog: on Extended Dialog
          Add-ons: AJAX Revolution, RO.IDEs Editor & Framework (in works) Utilities: Plugin Compatibility List
          Tutorials: Create Cross-Context Resources, Cross-Context AJAX Login, Template-Based Actions, Remove Extensions from URLs

          Failure is just another word for saying you didn't want to try. "It can't be done" means "I don't know how".
          • 28042 ☆ A M B ☆
          • 24,524 Posts
          This particular menu actually has the top level separated from the inner levels, and I'm not so sure that Wayfinder can be used to generate such code. It works recursively, so the inner levels are nested within their containing outer levels, no matter what the individual part's tpls produce.

          I ran into a similar issue using JQuery UI tabs for displaying search results. The tabs work by having a list of links (that get styled as tabs) and then a set of separate containers that have appropriate IDs to match their links (tabs) to show/hide under their respective tab. My solution there was to use Javascript to generate the links for the tabs after the search results were returned, using the search results categories to determine what links to generate.
            Studying MODX in the desert - http://sottwell.com
            Tips and Tricks from the MODX Forums and Slack Channels - http://modxcookbook.com
            Join the Slack Community - http://modx.org