Are you using a WordPress slider plugin and seeing lag time? Have you noticed that your homepage slider is loading slow? The following optimization techniques may be applied to the most popular WordPress slider plugins including:
- Slider Revolution
- LayerSlider
- Soliloquy
- RoyalSlider
- Slider WD
- Smart Slider
- Smooth Slider
- Master Slider
- MetaSlider
- Huge-IT Slider
Why is my WordPress Slider Slow?
Your WordPress slider is loading slowly because of the following 5 issues: slow WordPress hosting, an outdated slider plugin, outdated WordPress version, bulky uncompressed images, and slider optimization settings not properly configured. Learn how to address each issue in the tutorials below. If you follow these simple steps your slider will be load much faster, leaving a great first impression with your website visitors. Let’s get started!
1. Slow WordPress Hosting
The biggest cause of a slow website is your choice in web host. No matter how much you optimize your slider plugin, if you’re serving the JS, CSS & images from a slow hosting company, your slider will take a while to load. If you’re looking for a quicker solution, checkout the fastest web hosts compared. Additionally, you can review the best WordPress hosting options for a more in-depth analysis. If you’re a photographer, hosting an image-heavy portfolio website, then check out these top web hosts for photographers.
How to fix slow WordPress hosting: Signup for a top recommended host such as Bluehost to speed up your website. (starting at just $2.95/month)
2. Your Slider Plugin is Outdated
Slider Revolution, the most popular WordPress slider plugin, updates its code over a dozen times per year, on average. In 2017, for example, they had 16 updates (see the changelog here). Some of these updates include WordPress compatibility and optimization, while others have a direct impact on performance (such as the “Performance Monitor and better Performance Suggestions” addition). If your
How to fix outdated slider plugins: Sign into your WordPress admin. Select Dashboard > Updates > Select All > Update Plugins. Note that some WordPress themes have a separate recommended plugin section under the theme settings. If your slider plugin came installed with your WordPress theme, then you may find an update available here, and not in the standard Dashboard > Updates section.
3. Your WordPress Version is Outdated
Now that your plugins are updated, you’ll also want to ensure your WordPress version is up-to-date. Most updates to the WordPress framework include optimization for faster performance and website load times. Having both your WordPress version current, as well as your plugins updated, ensures peak performance (when on a fast web host).
How to Update WordPress Version: From the same Dashboard > Updates screen, you’ll notice an “Update Now” button on the “Update WordPress” page. Follow the prompts for a simple one-click update.
4. Your Images Are Not Optimized
Sliders are image heavy and serving un-optimized images through your slider plugin can have a significant impact on performance. Did you know that on average images account for 54% of a website’s page size? Reducing image size is a must in today’s web performance driven world!
How to Optimize Images on Your Website:
- Adjust your image size. Always scale down your images for an appropriate pixel dimensions for web resolution. As a rule, I try to have all my images 1200px width or less, as most websites and browsers will re-size an image this size or larger down to fit the user’s screen. If you’re using a photo editing program, such as Photoshop, you’ll want to utilize the image compression format within the software. In Adobe Photoshop, open your image, then visit the following: File > Export > Save for Web (Legacy) > then select either “PNG-24” or “JPEG” file formats. For PNG files, you’ll typically want to select the “Transparency” box, a well as “Convert to sRGB”. For JPEG, leave “Progressive” and “Embedded Color Profile” unchecked, but do check the box for “Optimized” and “Convert to sRGB”. Play with the “Quality” slider to adjust the resolution. You’ll want the file size to be as low as possible, while retaining enough quality. If the image begins to get fuzzy or pixelated in the Optimized tab preview pane, then increase the quality a bit. Generally, 60-80% quality is a good place to be, balancing file size with quality.
- Install a WordPress image compression plugin on your website. This will not only further optimize the images already in your media library, but will also automatically compress any images you upload in the future. My personal favorite is TinyPNG which uses smart PNG and JPEG compression to reduce image file size without impacting visual quality. They have a WordPress plugin available here. Alternatives to TinyPNG include ShortPixel Image Optimizer and WP Smush, two great WordPress plugins I also frequently use.
- Upload the image to your website, filling in the image title and image alt text fields in your CMS, as per SEO best practices.
5. Your Slider Plugin is Not Optimized
Did you know that many WordPress image sliders have an optimization section? Have you properly configured yours? Slider Revolution, for example, has both Lazy Load and Performance settings, allowing you to optimize and speed up load time. Check with your specific slider’s documentation or support section, to see if there is a specific guide for performance.
How to Speed Up Slider Revolution:
- To speed up Slider Revolution, first select one of the following Lazy Load settings, found under Edit Slider > Slider Settings > Performance and SEO Optimization. Here there are 4 settings; All (load all slider images), Smart (load first slide images and preload the next slide’s images as well), Single (load slide images “on demand”), and No Lazy Loading (load all images on initial page load). Which Lazy Load setting you choose depends on your slider functionality, how fast your site is to begin with, and what you need to optimize.
2. The second way to speed up Slider Revolution is to review the “Overall Slider Performance” section, which contains two buttons: “Show Full Statistics” and “Show All Issues”. Follow the performance suggestions listed here for optimal slider speed.
3. Last, to ensure the fastest Slider Revolution response times, ensure your System Requirements are met. Under the plugin’s main admin section, you’ll see a “System Requirements” box, which will give a status as to the recommended server stats, and what you are currently running via your web host. Select the “Check Now” button for a live refresh of your statistics.
Pro Tip: If you find you are below the Memory Limit, Max Filesize or Max Post Size, contact your web host and request that these limits be increased to the suggested amount. Oftentimes the web host will oblige, without needing to upgrade your hosting package or charging you additional monthly fees. However, if you find your web host does not meet the system requirements, and if they are unwilling to upgrade you free of charge, you’ll want to consider migrating to a new webhost such as Bluehost. I have found Bluehost technical support to be very accommodating with these system requirements for WordPress websites.
By implementing these five steps you should see a significant increase in your WordPress slider performance. If your website is still slow, you may want to see this article on How to Speed up WordPress.