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>
*note: do not forget to apply the code above to all places where you might have the spinner
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!