Support » Plugin: WP Smart Preloader » add custom loader

  • Hello ,
    I discovered your plugin I think it is interesting although I was trying to avoid plugins absolutely .. for optimization reasons. learning to insert code is a necessary pain. that’s why I’m looking for pure css loader

    unfortunately I have a little trouble to center them in full screen
    and your plugin (thank god!) allows that flexibility.

    here is the site I found for the css loader

    can you show me in image or in code how to successfully center one of these loaders? with an full screen orange background div for example

    this one for example.

    <div class="lds-circle"><div></div></div>

    .lds-circle {
      display: inline-block;
      transform: translateZ(1px);
    .lds-circle > div {
      display: inline-block;
      width: 64px;
      height: 64px;
      margin: 8px;
      border-radius: 50%;
      background: #fff;
      animation: lds-circle 2.4s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    @keyframes lds-circle {
      0%, 100% {
        animation-timing-function: cubic-bezier(0.5, 0, 1, 0.5);
      0% {
        transform: rotateY(0deg);
      50% {
        transform: rotateY(1800deg);
        animation-timing-function: cubic-bezier(0, 0.5, 0.5, 1);
      100% {
        transform: rotateY(3600deg);
    • This topic was modified 4 months, 3 weeks ago by neosan.
Viewing 1 replies (of 1 total)
  • Plugin Author catchsquarethemes


    Hello @nreljed

    Sorry for the late response. In case if you are still stuck with the issue, you can do that through css with:
    position: absolute;
    top: 50%;
    left: 50%;

    If this doesn’t help, then please share us your website’s url and will look that for you.



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