Apr 14 2023
If you have already updated your Business plugin to version 1.9.12 or are using the latest version, you may have noticed that the slider looks different. You may also notice that the Slider Swiper themes are no longer in the list of all themes. This is because we completely rewrote the Slider theme from scratch, using only native CSS and JS, making it super fast and added many features.
In fact, this is the beginning of a major redesign of all themes with the addition of new options and a significant increase in plugin performance. We plan to implement this gradually and include all the changes in the final release of version 2.
We have abandoned the use of standard HTML tags like span or div, replacing them all with custom ones. This makes the code much smaller, and there is no need to use the CSS !important property to give the same appearance on different websites. This was more of a problem, especially for web designers, when it was difficult to override plugin CSS styles due to the !important option.
In addition, the new slider uses AJAX, and if you have the Pagination option set, only a few reviews will be passed during the initial load, and the rest will be loaded as the slides move forward.
Let's compare the size of the HTML code for the slider in the current version, using custom tags and AJAX, and the old one, where standard DOM tags are used. There are two absolutely the same blank WordPress pages with the slider theme only. With the new version size of HTML about 11.5kB and for the old version (with the absoltuely the same number of reviews) it's 28.8 kB. The load time is also better 192 ms instead of 332 ms.
As you can also see all timing for the new Slider much better than old version, page finished for 770 ms instead of 2.54 s. This is because we started using loading="lazy" attribute for all images which gave an amazing optimization, as the browser itself decides when to load images based on view point for each image.
Along the way, we check all the functionality for errors and warnings in the W3C validator, as well as PageSpeed Insights, on all major versions of iPhone (7, SE2, 11, 13 Pro, 14) and Android. This means that you can use the new slider without any concerns in these areas.
In addition to the standard slider features such as auto play, speed, and hiding some elements (buttons, dots), a lot of new features have been added: pause on mouse hover and/or button/dot press, scroll by mouse wheel, swipe step, style editor and custom breakpoints. We want to stop and tell you more about some of the new features.
The swipe step option determines the number of slides that will be auto swiped, when clicking on the Prev & Next buttons, dots, or using the mouse wheel. It also affects the number of dots displayed. The larger the step value, the fewer dots will be displayed.
By default the scroll steps is the same like the number of visible slides, for instance, on the screenshot below you can see the slider with three slides and the scroll steps will be the same three.
But if we change the option Slider Options / Swipe step for dot it will be much less.
This can be useful who display a lot of reviews and the number of dots exceeds the page width.
It includes many of new options to make your slider beautiful and suitable for your website. You can change: slide height, space between slides, slide's background, border, text color, author name's color, rating and stars color, leave a review button and dot backgrounds.
You can also select the different slide layout with author names below the reviews like in the old Swiper slider, for instance.
By default, the new slider is responsive and automatically adjusts the number of visible slides for different screens: desktop, tablet, mobile. However, we received some requests to bring back the old option of manually setting the number of visible slides based on the browser size. You can find this option here:
It works like this: you can set any number of breakpoints, each of which includes two values, the first being the container size and the second being the number of slides. The number of slides is displayed if the container size is less than or equal to the first parameter. For instance, for a container width less than or equal to 300px, there will be one slide, for 500px there will be two, for 950px it will be 4, for 1100px there will be 1, and for 1800px it will be 3.
Our roadmap for the near future is the release of version 2.0 for the business plugin, which would include similar changes for all themes with new options for optimization and style customization.
We are open for discussion and welcome your suggestions and feedbacks!
Thank you very much for your attention!
