Replicate Hi Support Top Blue Box Announcement

davidsizu · ‎02-21-2017

Is there a straight forward way to replicate the behaivor of the current top blue box that Hi Support displays for announcement?

Thanks,

David

Vinamra Misra · ‎02-22-2017

Hi David [davidsizu ],

This is a custom implementation in HI. In the Header widget attached to the theme of the portal, you can make below modification to achieve this.

Server:

- Fetch the systemwide notification properties from the sys_property table.

- If the notification is only for logged in user - use gs.isLoggedIn() to determine if the notification is for guest/authenticated user. Since the header is also visible on the unauthenticated page, you might want to add this check.

Sample code:

data.securityMessageText = gs.getProperty('systemwide.security.message.text', '');

data.securityMessageLinkURL = gs.getProperty('systemwide.security.message.linkurl', '');

data.isLoggedIn = gs.getSession().isLoggedIn();

HTML Template:

- Update the HTML to show the custom announcement banner

- Use the above data properties to show data.

On cancel, we are storing the state in the session so that the message will not appear for the current session of the user.

View solution in original post

snehawankhade · ‎03-09-2017

Hello Teena,

I want to show announcement in banner frame for all users on servicenow instance for out client. I have tried putting text and URL in Banner Text property but it is truncating the third line. Can u please suggest how this can be achieved. in UI15 the message works fine but in UI 16 it doesn't appear properly.

Teena Singh · ‎03-12-2017

Hi Sneha,

I will see if I can find someone to help with this. Thanks for providing detail.

Regards,

Teena Singh
Customer Experience: UX Strategy and Customer Insights
teena.singh@servicenow.com

ServiceNow

Screen Shot 2017-01-19 at 8.55.52 AM.png

Vinamra Misra · ‎03-14-2017

Hi Sneha [snehawankhade ],

If you inspect the header you will notice that the navbar-header has a fixed height of 50px; If the text of the "glide.product.description" goes beyond that it will truncate.

Since the concourse header is not exposed the only way I can think to achieve is through DOM manipulation. You will have to increase the height of the header "navpage-header" and then reposition the "navpage-nav" (navigator) and "navpage-main" (gsft main) to adjust the layout. This code can exist in a global script.

Note: Global UI scripts are loaded after the gfst main loads, you will see a glitch where the navpage-header and navpage-nav will load and only after navpage-main loads the scripts will work.

Teena Singh · ‎03-16-2017

David,

Glad to see that you are using the Community to learn more.

The Customer Experience team is striving to ensure that customer queries posted from the HI Service Portal are answered in timely and accurate fashion.

If you feel your question has been resolved, please mark the appropriate reply in the thread as being the Correct Answer.

This enables other customers to learn from your thread.

Thank you in advance.

If you are viewing this from the community inbox you will not see the correct answer button. If so, please review How to Mark Answers Correct From Inbox View.

Regards,

Teena Singh
Customer Experience: UX Strategy and Customer Insights
teena.singh@servicenow.com

ServiceNow

Screen Shot 2017-01-19 at 8.55.52 AM.png