Sitefinity Navigation with Extra Text Above or Below the Menu Text - Front- & Back-End Development - Front- & Back-End Development - Progress Community
 Front- & Back-End Development

Sitefinity Navigation with Extra Text Above or Below the Menu Text

  • Sitefinity Navigation with Extra Text Above or Below the Menu Text
  • A few of our customers request this kind of feature and our own website now requires us to be able to show not only the regular Menu text, but some additional text just below the menu text.

    The following site shows a sample of this: http://www.4shade.co.za/

    How can this be achieved in Sitefinity Navigation?

    Regards,
    Jacques
  • J,

    jQuery would be a perfect candidate! This is how I've done it in the past...modified to fit your example.

    $(document).ready(function ()
         
        var i = 0;
        var tagLines = ["Homepage", "Who are we?", "Our latest work", "Get in touch"];
         
        $('.RadMenu .rmHorizontal > .rmItem').each(function(index)
            $(this).prepend('<span class="meta">' + tagLines[i] + '</span><br>');
            i++;
        );
         
    );

    Hope that helps!
  • in my App_Themes/DefaultTheme/js ?
  • Where do I put this code?
  • Jack,

    If you have a global.js file, or something similar, that would be best. If you're only looking to use it on a specific menu, then placing it on the master page where that menu appears would be ok.

    I haven't tested it inside of a javascript widget but, off the top of my head, I don't see why that wouldn't work either. :)
  • <script type="text/javascript">
      
      
        function radMenuOnClick(sender, args)
      
            var state = args.get_item().get_attributes().getAttribute("ExpandOnClick");
            args.get_item().get_attributes().setAttribute("ExpandOnClick", "true")
            args.get_item().open();
        
      
        function radMenuOnOpening(sender, args)
            var state = args.get_item().get_attributes().getAttribute("ExpandOnClick");
            if (state != "true")
                args.set_cancel(true);
            args.get_item().get_attributes().setAttribute("ExpandOnClick", "false")
        
     
        $(document).ready(function()
     
            var i = 0;
            var tagLines = ["Homepage", "Who are we?", "Our latest work", "Get in touch"];
     
            $('.RadMenu .rmHorizontal > .rmItem').each(function(index)
                $(this).prepend('<span class="meta">' + tagLines[i] + '</span><br>');
                i++;
            );
     
        );
         
         
         
    </script>>