Cornerstone Slider loads after page loads

Support
#1

X Pro Version 1.1.1
Site: http://fantasy-books.live
Wordpress Version: 4.8.1

Hello,

So, I have a problem. Cornerstone slider loads after the page loads, and so, for a few seconds, the page looks weird. Any idea on how to make it load faster? Or load before the page does?

-J

#2

Hello There,

Thanks for writing in! I have checked your page and I could not find the slider. Could you please provide the url where we can find this slider?

Best Regards.

#3

Specific url: http://fantasy-books.live/new-front

#4

Hey,

You can check this article to learn some tricks: https://wpengine.com/blog/site-speed-make-wordpress-lightning-fast/

#5

Wow, uh, in this particular instance, I’m referring, not to site speed, but to the fact that regardless of how fast or slow the site is, when the page loads, the problem is not that it loads slow, but that the Slider loads after the page itself.

So, everything on the page looks skewed for a good 5 seconds until the Slider loads.

It could be possible that the Slider runs asynchronously. Usually, that would be fine, except, the Slider is in the top-most position. Things don’t look right until the slider loads.

-J

#6

Hello There,

Thanks for providing the url of your page. Please keep in mind that the slider will only display once all of the slide images are loaded in the page. This is why as you noticed that while loading the page, you do not see the slider. It only appears after a few seconds when the page along with all the resource are fully loaded. If you want, you can set a minimum height for the slider so that it will display a blank section first before the slider fully display. You can make use of this code:

.sliderx {
    min-height: 204px;
}

Please let us know if this works out for you.

#7

Well, that was helpful. Thank You.

I understand what you mean. The slider won’t load until all the images load first. And there is no way to have the slider load first before the page renders. Anyway, I guess this is the better alternative.

#8

Hi There,

The best is to compress well the images you use on the slider.

So save it on photoshop as a jpg with high resolution, not very high or maximum.

Use www.tinypng.com to compress your images.

Hope it helps