Not every user check websites exceptionally from desktop devices. Often it happens that we have only mobiles or tablets close at hand. That is why all websites should look amazing both on each type of device. Fortunately, if you have installed ZeGuten plugin, all your blocks can be attuned accordingly to the screen resolution.
To add responsive posts carousel you should only add a carousel block to your page. You can create the carousel with any type of content inside. But in our case, we will create a WordPress post slider carousel. Let’s begin creating an amazing block that will impress every website reader.
Add WordPress post slider carousel
Find the page where you want to add the responsive posts carousel and open it in Gutenberg editor. To add block click on the + button and in the search field enter the name of the needed block. In our case, we should type the carousel and click on the block to paste it to your working field.
The Carousel block comes with 3 items and 2 slides to show by default. To add more items and change the number of slides, you should click on the block and go to the General Settings in the right sidebar Moreover, in this section, you can also attune some more values and settings according to your needs.
To set the number of slides to show on the different devices we should click on tablets and mobile icons. We will choose 3 for desktop, 2 for tablet, and 1 for mobile.
You can attune every item separately. For this purpose find the Item 1 Content, Item 2 Content, Item 3 Content tabs. Here you can add subtitle, title, and descriptions texts for header and middle parts of your items and change the buttons settings.
When you have finished editing all content of your items, go to the Style Settings tab to stylize the block according to the website design. Here you can change the color, typography, paddings, etc for 3 different parts of your items.
Notice that above each radius, padding, indent, height, size, margin, and width fields there are desktop, tablet, and mobile icons. Remember that you can set the values for each of these screen types separately to achieve a great view of your page.
Then you can change the arrows and dots settings in the Carousel Arrows and Carousel Dots tabs.
Here you can also change the settings for different types of devices.
To publish your carousel click on the Publish button and review the result.
If you turn on the Mobile view you will see how different our carousel looks on different devices.
So we have achieved the result to build responsive posts carousel. Hope, our tutorial was useful for you and wish you good luck in creating your own WordPress post slider carousel.