We launched new forums in March 2019—join us there. In a hurry for help with your website? Get Help Now!
    • 22535
    • 1 Posts
    I am a newbie to modx and currently enjoying some of its features.However im having issue with creating a vertical menu.What i want to do is that:
    I want to highlight my first menu item when the site loads for the first time. i seem not to find any appropriate Wayfinder template to do this for me.I need HELP

    My Current Wayfinder Call
    [!Wayfinder? startId=`1` &level=`1` &hereTpl=`menulinks` !]
    Wayfinder Template
    <li><a style="background-color:#ADADAD;" href="[+wf.link+]" title="[+wf.title+]">[+wf.linktext+]</a></li>
    [+wf.wrapper+]

    This only works once the link is clicked but i would want the first child menu to have a grey background once the site load.Thanks



    Thnaks alot Sottwell. I tried your suggession and found out that with the hereClass and selfClass the visitor would have to click the link first before it works. But the main issues still persist.When i load the index page fresh, nothing is hightlighted. But i would like my first child item to be hightlighted without the visitors involvement.Be glad if u could through more light on the issue.THANKS
      • 28042 ☆ A M B ☆
      • 24,524 Posts
      Actually you don’t need a distinct template for that if you’re using the default unordered list that Wayfinder generates. You can specify two classes to use, selfClass for the exact page the visitor is on, and hereClass for the "breadcrumb" of the page the visitor is on plus all of its parents up to the top level. These classnames will automatically be added to all li elements in the menu. You can then use CSS to style items with the selfClass name and/or the hereClass name you specify.
        [!Wayfinder? startId=`1` &level=`1`  &hereClass=`here` &selfClass=`self`  !]  

      Then in your CSS something like this will give all the a elements in the .here li containers the grey background:
      .here a{background:#adadad;}

        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