Hello Summer Sale!
Exclusive season-opening discount on TheGem theme.
Limited time offer.
Get Now

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,280
    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,280
    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