How to add Preloader in WordPress without plugin

Copy the following snippet code in functions.php

// WordPress Preloader by https://webcodeaddict.blogspot.com/

add_action( 'init', 'webcodeaddict_Preloader' );
function webcodeaddict_Preloader() { if(!is_admin() &&  $GLOBALS["pagenow"] !== "wp-login.php" ) { 
	
$delay = 1;	//seconds
$loader = 'https://lh3.googleusercontent.com/drive-viewer/AEYmBYSOBFwcTqY5wcd0fQwWh9mOILRr9y6ximWsEzs72TKa3kxK3BIxm9wFtcpaSqJfiHOTTkD2EjsNKipAId8105QKAawYjQ=s1600';
$overlayColor = '#ffffff';	
	
echo '<div class="Preloader"><img src="'.$loader.'" alt="" style="height: 150px;"></div>
 <style>
.Preloader {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: '.$overlayColor.';
    z-index: 100000;
    display: flex;
    align-items: center;
    justify-content: space-around;
}
</style>
<script>
document.body.style.overflow = "hidden";
document.addEventListener("DOMContentLoaded", () => setTimeout( function() { document.querySelector("div.Preloader").remove(); document.body.style.overflow = "visible"; } , '.$delay.' * 1000));
</script>
'; }}