When my website (https://www.wakeuplookandsee.com) loads the homepage, the carousel loads vertically before correcting to horizontal when the page is finished loading.
vertical (happens when loading)
———–
| |
| |
———–
| |
| |
———–
| |
| |
———–
horizontal (corrects itself after loading)
—————————————–
| | | | |
| | | | |
—————————————–
I would like to know how to ensure that the carousels load correctly on the desktop without affecting its responsive behaviour on smaller devices.
Hi, thanks for reaching out.
At the moment, we can’t think of a way to avoid this situation other than inlining the carousel CSS which wouldn’t be ideal. The issue is occurring before the carousel CSS has loaded.
Speeding up the page should help the situation. Have you perhaps given Autoptimize a try? It’s compatible with the Widgets Bundle. Once you’ve set up Autoptimize you could then go further and add a caching plugin if you aren’t using one at the moment. Autoptimize have the following caching plugin recommendation:
If you consider performance important, you really should use one of the many caching plugins to do page caching. Some good candidates to complement Autoptimize that way are e.g. Speed Booster pack, KeyCDN’s Cache Enabler, WP Super Cache or if you use Cloudflare WP Cloudflare Super Page Cache.
For CDN’s I quite like using KeyCDN as they allow credits to be purchased vs a monthly plan.