Excuse me for my english, I'm italian.

Enter the code at the end of this explanation in "STEP 1 Settings / Advanced / Statistics and Code / Code / Personalized Code / AFTER OPENING THE BODY TAG" (important! The code must necessarily be put "After opening the Body Tag" and not elsewhere, otherwise it wouldn't work!). See screenshot 01, arrow n. 1.
Then you have to attach the GIF of the loader you are interested in and that must appear before the page loads (you can download some very nice ones from the web, I am attaching the one of my online example here: https://www.giuseppeguida.it/provashop2021 ) and you have to attach it to the project with the "File Attachments to code" function and in the "Files" folder (Always look at the screenshot, arrow n. 2). Remember to rename the GIF file you download from the web always with the name "loader.gif" as shown in the code below:

<!-- Start Loader -->
<div id="loader" style="position:fixed;width:100%;height:100%;top:0px;left:0px;background-color:rgba(255,255,255,1);z-index:2000;">
<div id="custom_loader" style="position:relative;width:100px;height:100px;margin:0 auto;top:50%;background-color:rgba(255,255,255,0.2);border-radius:10%;z-index:2000;">
<p><img src="files/loader.gif" width="100" height="100" /></p>
</div></div>
<script>
function close_loader () {$("#loader").fadeOut("slow");
} window.onload=function() {setTimeout("close_loader ()", 500);}
</script>
<!-- End Loader -->