2 Replies Latest reply on Aug 23, 2016 12:09 AM by niharika1108

    Custom layout navigational bar

    niharika1108

      Hi,

       

      I have a requirement in which we want to build a custom navigation bar containing links Please see the image below:

      design_query.PNG

       

      when the user click on Link 1 the respective drop down should open and display the content of that link. Likewise each Link(Link2,Link3,Link4,Link5) have their drop downs showing different content and different layout. I want to design the whole functionality on overview page and the content should be displayed according to the links. For this I am using Angularjs.

      But I am getting confuse in one thing that I have different layout for each and every link

       

      • How to define different layout for different links?
      • Suppose in Link 2 I have to add announcements but I don't want to display announcements section when user clicks on link 3 is this possible to display them on one link an hide from the rest of the links?
      • I want to Hide some of the widgets that are present in Link 1 but should not get display in Link 2 and in Link3. How that can be achieved?

       

      Can anyone please assist me here it would be of great help.

       

      Thanks!

      -Niharika

        • Re: Custom layout navigational bar
          noelwhite

          Hi Niharika,

          I have an open source project that does this in an HTML Widget: GitHub - fmr-llc/jive-menu

          This allows you to creae a document with a bullet list defining your menu options, and then it will generate the code to go into an HTML Widget to create the menu.  You can use that if you do not want to re-create your own, or you can look at the code for reference to see I put the menu together.

            • Re: Custom layout navigational bar
              niharika1108

              Hi Noel,

               

              Thanks for sharing this. I have created the menu using Angular js. But the major issue I am facing is to hide widgets from the links. I have scenarios in which on one link I need some widget and on the other I don't want the same widget. Is there any way to achieve this. As I am not clear if this is possible or not.

               

              Regards,

              Niharika