Increase size of Editor Progress Indicator

  • When I open the Gutenberg editor, it takes a few moments to properly load everything before it is safe to begin editing. The (small) problem is that the progress indicator is so thin, often I don’t even notice it.

    Would it be possible to make the progress indicator a bit thicker and more visible?

Viewing 3 replies - 1 through 3 (of 3 total)
  • Moderator bcworkz

    (@bcworkz)

    Wait, there’s a progress indicator?? I’m not seeing it on my site, even after throttling my connection down to 3G speeds (where it took over 2 min. to fully load).

    I don’t doubt you have one, but I think it’s not a core G’berg feature. In any case you should be able to apply some custom admin CSS to change its appearance. The problem is I cannot suggest appropriate CSS since my site doesn’t have such a thing. You can use your browser’s element inspector tool to help you find appropriate CSS to apply. Interrupt the page load while the indicator is visible so it does not disappear while you’re investigating what CSS to use.

    Adding custom admin CSS does involve some PHP coding. Your PHP code can output the CSS code you came up with in its own inline style block from the “admin_print_styles” action hook.

    If you’re not up for custom PHP code, you could apply custom CSS via a browser extension such as “Stylus”.

    Thread Starter hmcody

    (@hmcody)

    I tried to insert a link to the image, but it wouldn’t take it so here is the link itself: https://drive.google.com/file/d/1MjpDEf7EO_rpQkyR5dLZd_Ej4d0Ot3TD/view?usp=sharing

    It is the very, very thin line in the middle of the big white rectangle. And it only happens with Theme files, not regular pages.

    I tried catching it with Inspect, but couldn’t grab the control. It might be something with my browser, but I kind of doubt it.

    Moderator bcworkz

    (@bcworkz)

    Thanks for the image, turns out I was looking in the wrong place. I see it on my site now. Unfortunately the progress bar is too fleeting, even with a throttled connection, for me to determine appropriate CSS to apply. And interrupting the page load doesn’t help any, it seems the delay is due to client side processing which I don’t know how to interrupt.

    I’m sorry, I don’t know what to suggest for a fix on your site. I’m curious though, you said its poor visibility (I agree it’s poor) prevents you from knowing when its safe to edit? Wouldn’t the appearance of page content be enough of an indication that it’s safe to proceed? All the progress bar is really for is to assure us something is happening and that your computer has not frozen up. When it goes away and you see page content then it’s safe to proceed.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Increase size of Editor Progress Indicator’ is closed to new replies.