Home Community Uploads
image

Cireson Partners, Customers and Community members share your customizations and examples here to help benefit the community as a whole to earn Kudos and badges.

DISCLAIMER

All files and projects located here are provided and come "as-is" and without any warranty or support. Use at your own risk. Your use of Community Uploads is subject to our Terms of Use.

Cireson does not and will not support or maintain these enhancements, extensions, and scripts.

For Team Cireson uploads click here.

Navazon - A Slightly Different Portal Navigation Experience

Justin_WorkmanJustin_Workman Cireson Support Super IT Monkey ✭✭✭✭✭

This is a replacement for the typical navigation down the left side of the portal. It provides some new functionality like: collapsible menu - so you get the navigation space back when not navigating, staying open on click as opposed to the hover/disappear, nested menus that cover up the parent menu so the nav bar never grows wider.

Here's what it looks like "open":

And Closed:

Menu Item with Children:

To install, drop the Navazon folder in CustomSpace and then add a reference to navazon.css in CustomSpace\custom.css like this:

@import url("/CustomSpace/Navazon/navazon.css");

And use loadScript to add a reference to CustomSpace\custom.js like this:

loadScript('/CustomSpace/Navazon/navazon.js',[""]);

Comments

  • Gabriel_LencesGabriel_Lences Customer Advanced IT Monkey ✭✭✭

    CHRISTMAS HAS ARRIVED.

    Thank you Justin, this is awesome! Just tried it for testing , we'll still need to play a bit around with the .css but that's the minimum we have to do in order for this to be perfect. Also we'll probably want it to stay "docked" by default and hide it by clicking on the hamburger menu, but we'll sort that out.

    @Justin_Workman the real MVP and not just in work, man. 😁 (Pun intended!)



  • Justin_WorkmanJustin_Workman Cireson Support Super IT Monkey ✭✭✭✭✭

    As @Gabriel_Lences mentioned in our last Open Floor meetup, I didn't include instructions on creating the headers in my Navazon. I just create a "link" in Navigation Settings and make the link address "navSection". The code interprets that and rather than create a clickable list item, it renders the header as shown in the screenshot

  • Gabriel_LencesGabriel_Lences Customer Advanced IT Monkey ✭✭✭

    Thanks for these additional instructions Justin :)

  • Justin_WorkmanJustin_Workman Cireson Support Super IT Monkey ✭✭✭✭✭

    Reiterating: I expect SCREENSHOTS!! 😋

  • Eric_EvansEric_Evans Member IT Monkey ✭

    I absolutely love this! I do have one question... Is it possible to have the menu open on default?

  • Justin_WorkmanJustin_Workman Cireson Support Super IT Monkey ✭✭✭✭✭

    @Eric_Evans - I'm glad you like it! Inside the buildNav function add this to the end:

    $('#navbutton').click()

    That will just fire a click event on the button forcing the navigation open but everything else will work the same.

  • Eric_EvansEric_Evans Member IT Monkey ✭

    Fantastic! I am new at all this, so I have a lot of questions, and not much to offer (at the moment). I assure you, the day will come where I will give back to the community as much or more than I take!

  • Brad_ZimaBrad_Zima Member Advanced IT Monkey ✭✭✭
    edited December 2020

    I'm having some trouble with using this in combination with a custom theme file from http://portalthemer.cireson.com something in the custom CSS file is setting the font-size attribute to 27px which is causing my text to come out too large. I've tried to track it down but the custom CSS file is 65,000 lines and my inspection tool isn't very helpful. Any ideas?


    EDIT: Nevermind, I realized I forgot to include the navazon CSS file in my custom.css. Works like a charm now!

  • Justin_WorkmanJustin_Workman Cireson Support Super IT Monkey ✭✭✭✭✭

    @Brad_Zima - Since you're just getting it in, you might try this version. It's got a few more features.

  • Brad_ZimaBrad_Zima Member Advanced IT Monkey ✭✭✭

    😮

    New version? Yes please!

  • Brad_ZimaBrad_Zima Member Advanced IT Monkey ✭✭✭

    @Justin_Workman

    Has anything changed with the CSS file or can I just overwrite it with my already customized version?

  • Justin_WorkmanJustin_Workman Cireson Support Super IT Monkey ✭✭✭✭✭

    There are some changes. Sorry

  • Brad_ZimaBrad_Zima Member Advanced IT Monkey ✭✭✭

    I've just discovered an issue with this in our environment. If a user who is not an analyst visits the Team Requests page, then closes sidebar, upon reopening it is just a blank box with no items. Anyone who is an analyst does not experience this problem.

  • Justin_WorkmanJustin_Workman Cireson Support Super IT Monkey ✭✭✭✭✭

    I hear you @Brad_Zima. I'll try to look at this soon.

  • Peter_MiklianPeter_Miklian Customer Advanced IT Monkey ✭✭✭
    edited March 2021

    @Justin_Workman Have you ever thought about a search filter for menus with many items?


  • Brad_ZimaBrad_Zima Member Advanced IT Monkey ✭✭✭

    @Justin_Workman have you had a chance to look at this? I'm starting to get enough complaints that I may have to take it back out.

  • Justin_WorkmanJustin_Workman Cireson Support Super IT Monkey ✭✭✭✭✭

    @Brad_Zima - Going to look now!

  • Brad_ZimaBrad_Zima Member Advanced IT Monkey ✭✭✭

    @Justin_Workman I'm starting to see a new error with Navazon an portal version 11.3.0 where the Navazon menu fails to load. Dev console gives me the following errors.

    Any ideas what might be the issue?

Sign In or Register to comment.