Want to add scroll to top button on bottom of ServicePortal Homepage

[SNOW46]

Hi All.

Can anyone let me know how to add one scroll to top button on bottom of the ServicePortal Homepage.

I want that when an user clicks on the top arrow button it will navigate to top of the page.

Thanks.

SNOW@Das

[Mark Stanger]

There is an out-of-box widget named 'SC Scroll to top'.  Although it's designed for use on mobile devices only (meaning it won't display on a larger browser screen) you can clone it and modify it as follows to make it work everywhere.  After the clone, simply adjust it as follows...

1)  Body HTML Template

<div>
	<button name="gotoTop" ng-click="goTop()" class="btn fa fa-arrow-up fa-lg padder-lg button-to-top pull-right"></button>
</div>

2)  CSS

.button-to-top {
    position: fixed;
    bottom: 0;
    right: 0;
    margin-right: 15px;
    margin-bottom: 15px;
    border-radius: 5px !important;
    opacity: 0.7 !important;
    padding: 12px !important;
    border: 1px solid !important;
    width: 47px;
    height: 45px;
    background-color: #ddd;
}

https://docs.servicenow.com/bundle/london-servicenow-platform/page/build/service-portal/concept/sc-s...

[SNOW46]

Hi Mark,

I tried cloning the widget and paste the same script as mentioned in your answer.

But I don't able to see the button on the homepage.

Can you please let me know where do I miss out or any changes needs to be done?

And also let me know if I need to define the CSS Class anywhere?

[Mark Stanger]

The button is designed to only show up when you begin to scroll upwards.  It's working in my system without issue on my homepage.

[taqdeer]

Hi Mark,

Does it works for the Change Form tooo?