+1-888-365-2779
Try Now
More in this section

Forums / Designing & Styling / Sitefinity Navigation with Extra Text Above or Below the Menu Text

Sitefinity Navigation with Extra Text Above or Below the Menu Text

6 posts, 0 answered
  1. Jacques
    Jacques avatar
    427 posts
    Registered:
    28 Jun 2007
    25 Jan 2012
    Link to this post
    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
  2. Tim
    Tim avatar
    258 posts
    Registered:
    22 Jun 2011
    25 Jan 2012
    Link to this post
    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!
  3. Jack
    Jack avatar
    3 posts
    Registered:
    10 May 2012
    10 May 2012
    Link to this post
    in my App_Themes/DefaultTheme/js ?
  4. Jack
    Jack avatar
    3 posts
    Registered:
    10 May 2012
    10 May 2012
    Link to this post
    Where do I put this code?
  5. Tim
    Tim avatar
    258 posts
    Registered:
    22 Jun 2011
    10 May 2012
    Link to this post
    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. :)
  6. Jack
    Jack avatar
    3 posts
    Registered:
    10 May 2012
    10 May 2012
    Link to this post
    <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>>
6 posts, 0 answered