Snippet: Simple Site Pre-loader
Total has a built-in site loading and page animation function however, if you just want a very simple pre-loader that shows up while your site is loading it's very easy to do with a little PHP and CSS.
// PHP Portion - this goes in your child theme's functions.php file
// Insert pre-loader
add_action( 'wpex_outer_wrap_before', function() {
echo '<div class="my-preloader"><img src="LOADER_IMAGE_URL" /></div>';
}, 1 );
/* CSS portion goes in your child theme style.css and must be modified to fit your needs/wants */
#outer-wrap {
opacity: 0;
visibility: hidden;
}
body.wpex-window-loaded .my-preloader {
display: none;
}
body.wpex-window-loaded #outer-wrap {
opacity: 1;
visibility: visible;
}
All PHP snippets should be added via child theme's functions.php file or via a plugin. We recommend Code Snippets (100% Free) or WPCode (sponsored)