+- MyBB Group (https://mybb.group)
+-- Forum: Beside You (https://mybb.group/Forum-Beside-You)
+--- Forum: Guidebook (https://mybb.group/Forum-Guidebook)
+--- Thread: FontAwesome (v5) - loading spinner (/Thread-FontAwesome-v5-loading-spinner)
FontAwesome (v5) - loading spinner - Eldenroot - 19-04-2019
To replace default MyBB spinner by a modern good looking FontAwesome spinner you will need to apply these changes:
- FontAwesome v5.x library is required, please load it on your website
1) Open "headerinclude" template and find this block of code:
var spinner = "<img src='" + spinner_image +"' alt='' />";and replace it with this one:
var spinner = "<img src='" + spinner_image +"' alt='' style='display: none' /><i class='fas fa-spinner fa-spin'></i>";2) Open "showthread_quickreply" template and find this block of code:
<div id="quickreply_spinner" class="showthread_spinner" style="display: none"><img src="{$theme['imgdir']}/spinner.gif" /></div>and replace it with this one:
<div id="quickreply_spinner" class="showthread_spinner" style="display: none"><img src="{$theme['imgdir']}/spinner.gif" style="display: none;" /><i class="fas fa-spinner fa-spin"></i></div>3) Open your "global.css" in your theme and add these few line of code below at the end of file:
#quickreply_spinner .fas {
font-size: 36px;
}4) You are done, refresh your page (Ctrl+F5) and check the result!