In most cases preloader is designed to fade out of the page on the right time, however there might be some edge cases that preloader will fade away while the page is still being not done rendering yet, here we will help you to overcome this issue.
Before we start:
- This article assumes you already have a preloader, and familiar with the process of creating a preloader and applying it to a master page, if you are not aware of this process, you can read more here.
- This article also requires basic knowledge of HTML editing.
Extract the Preloader code from your master page file.
You need to download your masterpage html file ( mostly it will be seattle.html unless you have explicitly renamed it into something else ), and open it in your preferred code editor.
The preloader code usually start with the following comment:
<!-- start page preloader embed script, auto-generated by ShortPoint -->
and will end with the following comment as well
<!-- end page preloader embed script, auto-generated by ShortPoint -->
You need to:
1. select those starting and ending comments and everyting in between, see the following screenshot for example.
2. Paste the code you copied into a blank code editor page
Modify the preloader code.
Now that you have the preloader copied into a blank code editor page, its time to do some tiny change on it.
Try to find the following number:
5e3 ( sometimes it might be 5000 as well )
both 5e3 or 5000 ( means 5 seconds ),
This is the maximum amount of seconds the preloader will wait until it gets faded out,
You need to increase this number to suit your case, for example you can set it to:
- 7500 ( 7 and a half seconds )
- 10000 ( 10 seconds )
- 15000 ( 15 seconds )
Replace newly modified code, with the old one.
- Copy the code you just modified,
- go back to your master page file,
- Delete the old preloader code
- Paste the new code there
Upload the masterpage file back to your SharePoint site as it is mentioned on our other preloader article here.