• Resolved generosus

    (@generosus)


    Good Day!

    Amazing plugin. One small thing …

    Can you guys provide a code snippet or CSS rule that will allow us to change the spinner (gif) that appears when we navigate from one tab to another? (or delete it altogether)

    Thank you!

Viewing 8 replies - 1 through 8 (of 8 total)
  • Plugin Author Emre Vona

    (@emrevona)

    ow my god ?? what a feature request.

    May I ask why you need that?

    Thread Starter generosus

    (@generosus)

    Hi @emrevona,

    Thank you for the quick reply. In response:

    1. We’ve never seen a plugin that depends on (or displays) a spinner when switching from one tab to another. Why do you need it anyway?
    2. We’d like to have the flexibility to use a spinner that matches the one we use throughout our website. Also, one that looks more modern (example)

    Would be awesome if you can help with the above request.

    Thank you!

    Thread Starter generosus

    (@generosus)

    Solved:

    To delete the spinner, use the following CSS Rule:

    #revert-loader-toolbar {
    display: none!important;
    }

    Note: The above will speed up dramatically your navigation between tabs.

    To change the spinner:

    1. Upload your desired spinner (i.e., gif image) to your Media Library.
    2. Copy the spinner File URL generated by your Media Library.
    3. Use the following CSS Rule to change the spinner:
    #revert-loader-toolbar {
    background-image:url(https://www.mysite.com/wp-content/uploads/black-hole-spinner-25x25-1.gif)!important; // use the File URL of your spinner
    background-color: transparent!important; // comment out this line to retain original background color
    }

    Result: https://prnt.sc/rcS39WY9JS82

    Note: The above CSS Rules are used to customize your WordPress Admin CSS. Click here for a detailed procedure to implement the above.

    Hi @emrevona,

    It would be great if you can pin this topic or add it to your plugin’s documentation.

    Thank you!

    Thread Starter generosus

    (@generosus)

    Update:

    To delete the spinner that pops-up when you click the link “Show Images” located inside the “Images Optimization” tab, you will also need to apply the following CSS Rule:

    #revert-loader {
    background-image:url(https://www.mysite.com/wp-content/uploads/black-hole-spinner-25x25-1.gif)!important; // use the File URL of your spinner
    background-color: transparent!important; // comment out this line to retain original background color
    }

    Cheers!

    Thread Starter generosus

    (@generosus)

    Correction:

    Above Update should state: “To change the spinner that pops-up when you click the link “Show Images” …

    Caveat:

    When deleting the spinners, and the “delete cache” links are clicked in the Admin Bar, there will be no visual feedback confirming that cache has been deleted. Actually, however, cache will be deleted.

    Plugin Author Emre Vona

    (@emrevona)

    a spinner is shown when switching from one tab to another because an ajax request is called. but now you have helped me realise that it is not a good idea. I will change it and let you know.

    Thread Starter generosus

    (@generosus)

    Hi @emrevona,

    That’s awesome. If you can also address the Admin Bar links styling issue we brought up, that would be awesome as well.

    If helpful, happy to volunteer our site for beta-testing your updates before releasing them.

    Cheers!

    Thread Starter generosus

    (@generosus)

    Additional Tip:

    If you want to change the WP Fastest Cache ajax spinner on both the backend and frontend of the WP Admin Toolbar, add the code snippet provided below to your functions.php file (or via code snippets plugin). You can also use other CSS rules to change the styling of other portions of your WP Admin Toolbar.

    Cheers!

    ———-

    // Customize Admin Toolbar CSS
    function override_admin_bar_css() {

    if ( is_admin_bar_showing() ) { ?>

    <style type="text/css">
    #revert-loader-toolbar {
    background-image: url(https://www.mysite.com/wp-content/uploads/2024/08/ajax-loading-gif-1.gif)!important; // use the File URL of your spinner
    }
    </style>

    <?php }

    }

    // Backend Area
    add_action( 'admin_head', 'override_admin_bar_css' );

    // Frontend Area
    add_action( 'wp_head', 'override_admin_bar_css' );
Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘How to Change or Delete Spinner’ is closed to new replies.