14 Replies Latest reply on Aug 14, 2014 1:55 PM by Charu10

    Create a dropdown menu in top nav

    Yoojay

      I am trying to create a new dropdown menu named "Links" to our top nav. I have successfully created it the menu item, but when I click on it, it just shows "Loading...." for a second then does nothing. I want the dropdown to contain a list of quick links that are currently being listed in an HTML widget on the page. I have included a screenshot and the code of the custom-navbar.soy file in the attached Word document. Here is the code I'm trying (code added for the new menu item is in RED):

       

      /**
      */
      {template .customNavbarMenus}
      <!-- ENGLISH -->
      <nav id="custom-nav" userlang="en" role="navigation" aria-label="Jive">
                      <ul class="j-globalNav">
                                      <li class="j-ui-elem custom-nav" role="menuitem" menu-id="links-menu-home" aria-haspopup="true">
                                                                      <a href="#" class="j-globalNavLink j-ui-elem"><span class="nav-link j-ui-elem">Links<span class="j-ui-elem j-nav-more"></span></span></a>
                                                                      <div id="links-menu-home" class="j-nav-menu j-menu j-pop-main custom-nav-menu" style="display: none;">
                                                                                      <ul>
                                                                                                      <li><a href="https://login.steelcase.com/sso/Concur.aspx">Concur</a></li>
                                                                                                      <li><a href="http://sapportal.steelcase.com/irj/portal/ess">ESS/MSS</a></li>
                                                                                                      <li><a href="http://mar.steelcase.com/">MAR</a></li>
                                                                                                      <li><a href="https://login.steelcase.com/sso/carlson.aspx">Travel</a></li>
                                                                                                      <li><a href="http://my.steelcase.com/">SharePoint MySite</a></li>
                                                                                                      <li><a href="http://sapportal.steelcase.com/irj/portal/ss">SupplySync</a></li>
                                                                                                      <li><a href="https://village.steelcase.com">Village</a></li>
                                                                                      </ul>
                                                                      </div>
                                      </li>
                                      <li class="j-ui-elem"><a class="j-globalNavLink j-ui-elem" href="{buildUrl('/community/resources')}">Resources</a></li>
                                      <li class="j-ui-elem"><a class="j-globalNavLink j-ui-elem" href="{buildUrl('/community/company')}">Company</a></li>
                                      <li class="j-ui-elem"><a class="j-globalNavLink j-ui-elem" href="{buildUrl('/community/news')}">News</a></li>
                                      <li class="j-ui-elem"><a class="j-globalNavLink j-ui-elem" href="{buildUrl('/community/breakroom')}">Breakroom</a></li>
                                      <li class="j-ui-elem"><a class="j-globalNavLink j-ui-elem" href="{buildUrl('/community/help')}">Help</a></li>
                      </ul>
      </nav>


                     
      {/template}

       

      Thanks for any advice anyone can provide.

       

      John