Navbar Menu in Service Portal

MCH
Mega Contributor

Hi,

We have a requirement of our customer for Homepage design to our Service Portal.
The homepage design include a navbar menu in the left side of the screen.
The regular menu of Service Portal is top menu.
We need the option to implement our Homepage Portal exactly as the layout of homepage of HI service portal.
Screenshot of the UI is attached.
What are the options to implement this?
Thank for any answer.

Michal.

3 REPLIES 3

nathanfirth
Tera Guru

The difference between a top menu and a side menu is the HTML & CSS. You will need to create a custom header widget, and then use custom CSS to style it to have fixed width and 100% height.

We've created several portals with left navbar... it's not difficult, but requires experience with creating custom themes using Bootstrap. Unfortunately, I'm not able to send you the code that we wrote... however you should be able to use Chrome Web Developer Tools to inspect the HI portal and see the HTML & CSS they used.

Or you can also check out some tutorials for side navbars, such as this one: https://bootstrapious.com/p/bootstrap-sidebar

-----------------
Nathan Firth
Founder and ServiceNow Architect
NewRocket, Inc.
nathan.firth@newrocket.com
http://serviceportal.io
http://newrocket.com

Hi Nathan,

 

So when you created the header widget, did you create it as a widget that you drag and drop in the page like the other widgets and then the content on the right window is just like how you would lay out widgets on a regular page designer page..?

find_real_file.png

Because and alternate idea I had was to just have a big page widget, something like an iFrame and do all the HTML/CSS in there "by hand" including laying out the columns in the right hand side of the left nav

find_real_file.png

 

Thanks,

Thomas

 

benjamin_alldri
Mega Expert

There was actually a thread on this exact topic yesterday. There's a few useful pointers in there which should help in your case too I'm sure. Check it out: 

https://community.servicenow.com/community?id=community_question&sys_id=ac252144dbbd1380032a7a9e0f96...