UI Builder: Add Header Menu
Developing Creative Business Solutions On ServiceNow on CodeCreative | A ServiceNow Blog
·
Jul 14, 2021
·
article
Purpose: How to add a header menu to a Portal Experience in ServiceNow UI Builder. The header menu is displayed at the top of every page in a Portal Experience. Open Experience in UI Builder Click “Menu” Click “Edit Experience Settings” Click “Navigation and Menus” Click “Advanced Footer Settings” Note: Currently the Advanced Navigation Menu Settings link is broken Complete UX Page Property form as follows: Page: current Portal Experience name Name: chrome_menu Route: leave blank Description: any text Value: [ { "value": { "label": { "translatable": true, "message": "Knowedge" } }, "children": { "action": { "label": { "translatable": true, "message": "Report an issue" }, "type": "route", "rightIcon": "chevron-right-fill", "value": { "route": "catalog", "fields": { "sysId": "3f1dd0320a0a0b99000a53f7604a2ef9" } } }, "items": [ { "value": { "label": { "translatable": true, "message": "Categories" } }, "children": { "action": { "label": { "translatable": true, "message": "Browse All" }, "type": "route", "rightIcon": "chevron-right-fill", "value": { "route": "article", "fields": { "sysId": "3020c9b1474321009db4b5b08b9a712d" } } }, "items": [ { "value": { "label": { "translatable": true, "message": "IT" }, "type": "route", "value": { "route": "article", "fields": { "sysId": "3020c9b1474321009db4b5b08b9a712d" } } } }, { "value": { "label": { "translatable": true, "message": "Benefits" }, "type": "route", "value": { "route": "article", "fields": { "sysId": "3020c9b1474321009db4b5b08b9a712d" } } } } ] } } ] } } ] Click Submit Close the current browser tab to return to the UI Builder browser tab Close portal settings Click “Open” to test page Special thanks to Ninja Bytes
https://codecreative.io/notebook/ui-builder-add-header-menu/