Sliders are the most widely used design elements on websites. They are usually the first parts of the page the visitor sees when they arrive. Thus, people are using sliders to showcase their most important content. Since sliders are so important parts of the site, they often have some kind of inner navigation. For example, arrows or bullets, to go to one slide from another one. When there are many slides to see, arrows are a bit uncomfortable to use. Bullets are slightly better, but they’re hard to use on mobile devices. This is why slider developers came up with the idea to create a thumbnail slider.
Thumbnails are one of the best navigation elements a slider can use. They are visual items and allow the visitor to quickly navigate to the slide which they would like to see. Visitors can see how many slides are there to see, and the images are easy targets for mobile users. A slider with thumbnail navigation increases the user experience of the site, and they are nice bonuses to a slider.
Create nice looking, responsive thumbnail sliders
Smart Slider 3 is the best tool to create a stunning responsive image slider with thumbnails. It allows you to place the thumbnails anywhere you want inside or around the slider. It’s possible to show them only when the mouse is above the slider. There are many customization options in Smart Slider 3. For example, you can change the color of the thumbnail bar. You can set the size of the thumbnail images, and choose whether the slider switches on click or on hover. What is even more, you can group the thumbnails. For example, making them show up in 3 rows, which is handy when there are many slides to see.
Thumbnails are great and not just because they let the user know how many slides (images) the slider has, and realize there are more content for them to see. It is also an awesome way of navigation, as they don’t have to go through many slides one by one if they would like to check a slide in the middle of the slider. Additionally, it is a fantastic way of navigation for mobile users, as large thumbnails are great target for them.
WordPress Post slider with thumbnails
Smart Slider 3 allows you to create a slider from your WordPress posts. You can add thumbnails to these sliders, which will show, for example, the featured image of the posts. While a picture is worth a thousand words, sometimes words are needed to complete the story. You can show the slide name and description near the thumbnail image. In a post slider’s case, these can be the title and summary of the post. Reading the post title helps the visitor decide whether they want to check out the post slide or not.
Video slider with horizontal thumbnail
Smart Slider 3 is not just a simple thumbnail slider plugin, but you can create video slides as well. You can display videos from YouTube, Vimeo or from your own server as well. But it’s not easy to tell by seeing a still image that the slide has a video. This is why we made an option to change the thumbnail type to video. Video thumbnails have a small play icon on them, which lets the visitor know about the video on the slide.
Nice thumbnail slider effects
People love to see nice effects on websites they visit. Smart Slider 3 has many favored design effect which you can use to please your visitor’s needs. You can select the Ken Burns effect for the images in your thumbnail slider. This effect slowly zooms on the images, and it’s a popular design choice by modern web designers. The parallax effect for both slide backgrounds and layers are available as well. There are nice looking background animations, to make the slide switching more interesting. There is an intuitive layer animation builder to create amazing layer effects.
Sliders usually occupy a limited area on a page. This is especially true for a thumbnail slider, which is rarely used as full width slider. Smart Slider 3 has a lightbox feature, which you can use to enlarge the currently viewed image. This lightbox can go through every image inside the slider, switching the slides as well. What is even more, you can create a mini-gallery via lightbox at every slide.
How to speed up your thumbnail slider?
A thumbnail gallery usually contains many images. These images are often large, which causes slow page loading. This decreases the user experience because they need to wait more to see what they’re after. Smart Slider 3 has many options for you to get back the page speed when you use a thumbnail slider. One of the most useful features in this list is the image optimization. This resizes the background images to the sliders or to a given size. It also resizes the thumbnails, which gives you extra speed. You can lazy load the background images you use. This way instead of loading every image, the slider loads only a given amount of them.
The maximum slide count and the randomization are also useful features. The randomization allows you to display the available slides in a random order. For example, you can show a different first image for the visitor every time they come to the page. The maximum slide count is helpful when it doesn’t matter whether the visitor can see every image upon arrival. The only thing that matters is that they have to see images with thumbnails each time.