• Resolved cjyabraham

    (@cjyabraham)


    Quick question: I searched the options but couldn’t find a way to do this… is it possible to hide the loading spinner? Thanks.

    • This topic was modified 3 months, 2 weeks ago by  cjyabraham.

    The page I need help with: [log in to see the link]

Viewing 9 replies - 1 through 9 (of 9 total)
  • Plugin Author Sayontan

    (@sayontan)

    Since the spinner is an integral part of the loading process there is no option to hide it. You can, if you want, use custom CSS to attain your objective, but there is going to be some unpredictability in how the rendering happens.

    To do so add the following to Appearance → Customize → Additional CSS:
    .photonic-loading { display: none !important; }

    Ok. Thanks.

    I kinda was wondering the same thing. But as I udnerstand it’s not a good idea to hide it, not even with css.

    So is there a way to make the white square, in which the spinner is located, transparent? White doesnt really go well with my dark background…

    Plugin Author Sayontan

    (@sayontan)

    Like the above, you can set the background of the .photonic-loading CSS element to a different GIF. Essentially:

    .photonic-loading {
    	background: #000 url(https://your-gif-url) no-repeat center !important;
    }

    Hey, thanks for the reply. If I create a 1×1 pixel transparent gif, can I use this or will this cause any issues with the loading spinner?

    Snake-Plissken

    (@snake-plissken)

    Hi,

    I am having issues getting this to work. I created a transparent.gif with the size of 50×50.

    Now when the spinner loads, it shows a completely black square and I don’t even see the spinner anymore.

    Do I actually have to create the animation with the spinner as a gif?

    Thats the gif i am currently trying to use.
    https://gatetoadventures.com/wp-content/uploads/2019/06/transparent.gif

    Plugin Author Sayontan

    (@sayontan)

    Do I actually have to create the animation with the spinner as a gif?

    Yes. The white background is a part of the current GIF, otherwise it would have been easy to simply change the background without creating a new GIF.

    Snake-Plissken

    (@snake-plissken)

    Ah yeah, why would it be easy 😉

    Ok so I played a little bit with it. So your original gif seems to have already a transparent background, however the square box in which it is displayed seems to create the white or in my case always black background.

    Is there a way to change the attributes of this “box” and also is there a way to change the size, for different loading animation?

    Plugin Author Sayontan

    (@sayontan)

    Depends on what you want to do. The spinner is managed by the .photonic-loading class, so pretty much everything you want can be managed with it.

    E.g.:

    .photonic-loading {
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        margin-left: 0;
        margin-right: 0;
    }

    … will make it cover the whole screen.

    This:

    .photonic-loading {
        background: rgba(0,0,0,0.5) url(http://your-gif-url) no-repeat center;
    }

    … will change the background to be black and translucent.

Viewing 9 replies - 1 through 9 (of 9 total)
  • You must be logged in to reply to this topic.