If this tutorial is not what you were looking for, you still have any questions, suggestions or concerns - feel free to let us know. Please help us to serve you better!

Your Name

Your Email

Your Message (required)


Featured templates

WordPress Cherry 3.x. How to change pages pre-loader

The following tutorial will show you how to edit pages pre-loader in WordPress.

WordPress. How to change pages pre-loader

  1. You’ll need to use a developer tool like Firebug to locate code that needs to be changed in CSS. Please reload the site, right click on loader and choose Inspect with Firebug:


  2. In the Style field you’ll see the css code that displays the loader:


  3. Please copy all the rules you located with needed selector (in our case #loader) to the bottom of your Cherry options -> General -> Custom css field to edit there:


  4. You can change the animation features, color, thickness of the lines and so on:


  5. Please check here for more detailed explanation on how to work with animation in CSS.

  6. Here let’s try to change the HEX color and the thickness of the lines in the loader by changing values next to color and border:


  7. Once you’re done editing, please hit Save options and reload the front-end of your site to see the result:


Feel free to check the detailed video tutorial below:

WordPress. How to change pages pre-loader

Live Chat
We help you to choose the right product.
Start chat