Changing default loader

Greetings.   I am struggling with loader. for some time I want to change it. I was not able to find some useful information about this topic. Can anyone give me any guidelines how to change default loader?   Thank you very much in advance.
5 answers

Hi Branislav,

Do you mean the progress bar? There just was a question about this, which includes an answer:

Good luck!


this simple way with CSS code 

1- download your custom preloader gif and put it close to the custom.css file 

2- open custom.css file

3- use class “. mx-progress-indicator ” to modify the preloader 
4- then run your code and tell us your feedback

like :

    background-image: url(../preloader/preloader.gif) !important;
    height: 84px;
    width: 83px;
    background-repeat: no-repeat;
    background-size: 85px;
    margin: 0 auto;

Hi Branislav

I haven’t seen circle loader yet. Do you mean spinner in Web Modeler?


Yes, i am thinking about spinner. But I dug out solution: 

Changes should be made in Phonegap package. I placed new GIF image in folder www/img. Next, i changed a little bit code in www/css/index.css and in www/index.html, to suit my needs. 


Sorry for not precised question, but thank you very much for everything. :)


Cheers and best regards.


You can use CSS styling for this.

Dough if you have to replace the full loading indicator there are some hacks shown in this lib.

when taking this approach, be care full, as you will overwrite part of the API it could give trouble in the future. 
This method was proposed to me by Andries smit

Good luck!