Take your website
To the next level
Discover our newly launched customization services and elevate your web projects to new heights.
Delegate tasks, save time, and unlock the power of professional WordPress outsourcing.
Hire Us

Okay
  Public Ticket #1569070
Preloader Not Changing
Closed

Comments

  • gthuo started the conversation
    May 9, 2018 at 10:08am

    I see on the Gem theme options there is a setting for changing preloader, but it never really changes. It remains the same even after changing.

    I'm assuming the preloader is that "spinner" that appears when the site is loading. 

  •  1
    Fbian replied
    May 9, 2018 at 2:10pm

    I have the same issue

  •  7,092
    Oliver replied
    May 10, 2018 at 9:58am

    Hi,

    pls. add screenshot what preloader you need to change. 

    Please note if you comment on your ticket before we reply, your ticket will be pushed down of the tickets list. 

    Regards, Oliver

  • gthuo replied
    May 10, 2018 at 10:20am

    This is the one I'm referring to

  •  7,092
    Oliver replied
    May 10, 2018 at 11:00am

    it's preloader for the galleries and portfolio. If you need to change main preloader:

    You need to edit: wp-content/themes/thegem/css/thegem-preloader.css 

    Or use next css:

    body #page-preloader {    background: #2c2e3d;
}
body #page-preloader .page-preloader-spin,
body .block-preloader .page-preloader-spin,
body .preloader-spin {    border: 2px solid transparent;    border-top-color: #b9b7ff;
}
body .preloader-spin {    border-top-color: #b9b7ff;
}
body #page-preloader .page-preloader-spin:before,
body .block-preloader .page-preloader-spin:before,
body .preloader-spin:before {    border: 2px solid transparent;    border-top-color: #00bcd4;
}
body .preloader-spin:before {    border-top-color: #00bcd4;
}
body #page-preloader .page-preloader-spin:after,
body .block-preloader .page-preloader-spin:after,
body .preloader-spin:after {    border: 2px solid transparent;    border-top-color: #a3e7f0;
}
body .preloader-spin:after {    border-top-color: #7b97ab;
}

    In order to change loader to your image, use this css:

    #page-preloader.preloader-loaded .page-preloader-spin {    background-image: URL('URL_OF_THE_IMAGE');    background-size: cover;    width: 150px;    height: 150px;    border: none;
}
#page-preloader.preloader-loaded .page-preloader-spin:before
#page-preloader.preloader-loaded .page-preloader-spin:after {    display: none;    }


    Please note if you comment on your ticket before we reply, your ticket will be pushed down of the tickets list. 

    Regards, Oliver