Title: Slider and Carousel Block – Responsive, Accessible Author: lubus Published: ජූලි 27, 2025 Last modified: අප්‍රේල් 14, 2026 --- Search plugins ![](https://ps.w.org/blablablocks-slider-block/assets/banner-772x250.png?rev=3334725) ![](https://ps.w.org/blablablocks-slider-block/assets/icon-256x256.png?rev=3334725) # Slider and Carousel Block – Responsive, Accessible By [lubus](https://profiles.wordpress.org/lubus/) [Download](https://downloads.wordpress.org/plugin/blablablocks-slider-block.1.2.0.zip) [Live Preview](https://si.wordpress.org/plugins/blablablocks-slider-block/?preview=1) * [Details](https://si.wordpress.org/plugins/blablablocks-slider-block/#description) * [Reviews](https://si.wordpress.org/plugins/blablablocks-slider-block/#reviews) * [Installation](https://si.wordpress.org/plugins/blablablocks-slider-block/#installation) * [Development](https://si.wordpress.org/plugins/blablablocks-slider-block/#developers) [Support](https://wordpress.org/support/plugin/blablablocks-slider-block/) ## Description **Slider Block** (part of the **BlaBlaBlocks** suite) is a WordPress plugin that lets you build **responsive sliders**, **carousels**, and **Gutenberg sliders** directly inside the Block Editor no shortcodes, no page builders, and no coding required. This block gives you an intuitive, visual way to add sliders to your pages, posts, or full site editing templates. Choose from ready-to-use templates or start from scratch, fully customize slide layout, autoplay, and navigation all within the native WordPress interface. ### Why Choose BlaBlaBlocks Slider Block? * **Accessible by Design** – WCAG-compliant with ARIA roles, keyboard navigation, and screen-reader support. * **Responsive and Fluid** – Automatically adapts to mobile, tablet, and desktop breakpoints. * **Gutenberg-Native Experience** – Seamlessly integrated into the Block Editor. * **Query Loop Support** – Turn WordPress posts into a dynamic carousel using the native Query Loop block. * **Template Library** – Insert pre-built slider layouts: hero sections, testimonials, image carousels, and more. * **Server-Side Rendering** – Ensures your editor preview always matches the frontend output. * **Lightweight and Fast** – Minimal scripts, optimized rendering, and no frontend bloat. Whether you’re creating a full-width hero slider, a small testimonial carousel, or a product showcase, the **Slider Block** makes it simple, accessible, and fast. ### Key Features #### **Accessible Sliders** Every slider is fully accessible out of the box: * Keyboard navigation for next/previous slides. * ARIA labels and roles for assistive technologies. * Screen reader-friendly transitions. * Optional focus management for improved UX. #### **Responsive by Default** Your slider automatically scales to different viewports. Adjust slides per view, spacing, and breakpoints — perfect for mobile-first sites. #### **Gutenberg Integration** Built entirely for the **WordPress Block Editor**, this plugin uses the latest React- based block architecture. You can: * Drag and drop slides directly in the editor. * Use nested blocks for advanced layouts. * Adjust all options in the right sidebar no shortcodes or widgets. #### **Posts Carousel with Query Loop** Build dynamic carousels from your latest or filtered posts using the native **Query Loop** block. You can: * Insert the **Posts Carousel** variation directly from the Slider block. * Use WordPress query controls to choose post type, order, and posts per page. * Customize the post template with core blocks like featured image, title, excerpt, date, and read more. #### **Pre-Made Templates** Skip the setup with built-in templates for: * Hero sliders * Image carousels * Testimonials * Content showcases Each template is fully customizable just insert, edit, and publish. #### **Advanced Configuration** Fine-tune every detail: * Slides per view * Pagination and navigation controls * Autoplay and speed settings * Transition effects * Direction (horizontal/vertical) #### **Lightweight and Optimized** Slider Block uses minimal JavaScript and CSS only loading assets when the block appears on the page. This ensures fast load times and top performance scores. ### How to Create a Slider in Gutenberg 1. Open the Block Editor (Gutenberg). 2. Search for “Slider” to add the block. 3. Insert the **BlaBlaBlocks Slider Block**. 4. Add slides you can use images, headings, buttons, or any block inside each slide. 5. Customize slider options in the sidebar panel (autoplay, speed, arrows, pagination). 6. Save and preview your responsive slider is ready! Check [documentation](https://github.com/lubusIN/blablablocks-slider-block/wiki) more details. ### How to Use Templates Library 1. Click the **“Template Library”** button inside the slider block toolbar. 2. Choose from multiple designs Hero, Testimonial, Carousel, Gallery. 3. Customize slide content, layout, and animations instantly. Check [documentation](https://github.com/lubusIN/blablablocks-slider-block/wiki) more details. ### Common Use Cases * Homepage hero sliders with call-to-action buttons. * Testimonial carousels on service pages. * Logo sliders for brand showcases. * Product image carousels in WooCommerce product pages. * Featured content sliders on blogs or portfolios. ### Technical Features * Built with React + WordPress Block API. * Uses Swiper.js. * Supports dynamic slide content. * Server-side rendering ensures perfect frontend/editor consistency. * Fully compatible with WordPress 6.6+ and PHP 7.4+. ### SEO and Performance Slider Block follows best practices for: * **Semantic HTML** output. * **Accessible ARIA structure** for screen readers. * **Optimized DOM footprint** for Core Web Vitals compliance. ### Troubleshooting **The slider doesn’t autoplay:** Check the block settings and ensure “Autoplay” is toggled on. Autoplay is disabled by default for accessibility reasons. **Keyboard navigation not working:** If multiple sliders are on a single page, ensure you’re using version 1.1.0 or later (this fixes navigation conflicts). **Layout issues on mobile:** Try adjusting the “Slides per view” setting or resetting custom CSS if applied by your theme. ### Integrations * Works with **WordPress Core Blocks** (Image, Heading, Button, Group). * Compatible with **WooCommerce** product blocks. * Can be combined with **block patterns** and **reusable blocks** for advanced layouts. ### Open Source and Contributions The BlaBlaBlocks Slider Block is 100% open source. You’re welcome to use, modify, or contribute improvements. * **Source Code:** [https://github.com/lubusIN/blablablocks-slider-block](https://github.com/lubusIN/blablablocks-slider-block) * **Report Issues:** [https://github.com/lubusIN/blablablocks-slider-block/issues](https://github.com/lubusIN/blablablocks-slider-block/issues) ## Screenshots * [[ * **Block Editor Settings** – Adjust your slider layout, animation, and navigation instantly. * [[ * **Responsive Slider Preview** – See how your slider adapts to desktop, tablet, and mobile screens. * [[ * **Template Library** – Choose prebuilt hero, testimonial, and carousel templates for instant setup. * [[ * **Frontend Example** – A live responsive slider displayed on your site using default theme styling. ## Blocks This plugin provides 2 blocks. * Slider A customizable slider block to display multiple slides with smooth transitions, ideal for showcasing images or content in a dynamic carousel format. * Slide A single slide within a slider block. ## Installation ### Automatic 1. Log in to your WordPress dashboard. 2. Go to **Plugins Add New**. 3. Search for **“BlaBlaBlocks Slider Block”**. 4. Click **Install Now**, then **Activate**. ### Manual 1. Download the plugin ZIP file. 2. Upload it to `/wp-content/plugins/` via FTP or the Plugin Upload tool. 3. Activate through the **Plugins** screen in WordPress. ## FAQ ### 1. Can I use the slider with any WordPress theme? Yes, the slider works with all themes that support Gutenberg, including block-based and classic themes. ### 2. Does it work with Full Site Editing (FSE)? Absolutely! You can add sliders to templates, template parts, or any block pattern area. ### 3. Can I create multiple sliders on the same page? Yes, multiple sliders are fully supported, and each instance maintains its own settings. ### 4. How can I control autoplay? In the block sidebar, you can toggle autoplay on/off and configure delay and transition speed. ### 5. Is this plugin compatible with caching plugins? Yes, it works seamlessly with major caching and optimization plugins like WP Rocket and LiteSpeed Cache. ### 6. Can I use custom content inside slides? Definitely. You can use any block – headings, images, buttons, or even nested groups inside a slide. ### 7. Does it support touch gestures? Yes, Slider Block supports swipe gestures on mobile and tablet devices by default. ### 8. Is there a shortcode? No shortcodes are required. Everything happens visually in Gutenberg. ### 9. How do I report bugs or request features? You can open an issue on [GitHub](https://github.com/lubusIN/blablablocks-slider-block/issues). ### 10. Is it open source? Yes! BlaBlaBlocks Slider Block is open source and free under the MIT license. ## Reviews ![](https://secure.gravatar.com/avatar/807225c3ea3b68a06bf38e9eeb36b47654652b4ba16c8f1148036daa3e649d0b? s=60&d=retro&r=g) ### 󠀁[Great slider plugin for block theme !](https://wordpress.org/support/topic/great-slider-plugin-for-block-theme/)󠁿 [DeepBlue](https://profiles.wordpress.org/deepblue5/) මාර්තු 22, 2026 Hi Great job thank you ! [ Read all 1 review ](https://wordpress.org/support/plugin/blablablocks-slider-block/reviews/) ## Contributors & Developers “Slider and Carousel Block – Responsive, Accessible” is open source software. The following people have contributed to this plugin. Contributors * [ lubus ](https://profiles.wordpress.org/lubus/) * [ Ajit Bohra ](https://profiles.wordpress.org/ajitbohra/) * [ Punit Verma ](https://profiles.wordpress.org/punitv342/) [Translate “Slider and Carousel Block – Responsive, Accessible” into your language.](https://translate.wordpress.org/projects/wp-plugins/blablablocks-slider-block) ### Interested in development? [Browse the code](https://plugins.trac.wordpress.org/browser/blablablocks-slider-block/), check out the [SVN repository](https://plugins.svn.wordpress.org/blablablocks-slider-block/), or subscribe to the [development log](https://plugins.trac.wordpress.org/log/blablablocks-slider-block/) by [RSS](https://plugins.trac.wordpress.org/log/blablablocks-slider-block/?limit=100&mode=stop_on_copy&format=rss). ## Changelog #### 1.2.0 * Added Query Loop support for Posts Carousel in the Slider block. * Updated Plugin Name. * Bump plugin version to 1.2.0. #### 1.1.2 * Added decimal support to `slidesPerView` setting. * Bump plugin version to 1.1.2. * Update “Tested up to” to 6.9. #### 1.1.1 * Enhanced **Gutenberg slider** performance and transition smoothness. * Updated **responsive breakpoints** for improved mobile and tablet layouts. * Improved **keyboard navigation** and screen reader accessibility. * Fixed **autoplay** configuration issues on multiple slider instances. #### 1.1.0 * Added pagination and navigation position options. * Added new **slider templates** for more layout flexibility. * Fixed hero section autoplay (disabled by default). * Fixed keyboard navigation conflicts with multiple sliders. * Updated `slidesPerView` logic for auto-adjustment and responsiveness. #### 1.0.2 * Improved sanitization of wrapper attributes for security and standards compliance. #### 1.0.1 * Added `render.php` for server-side rendering. * Improved save logic and accessibility. * Updated build process and dependencies. #### 1.0.0 * Initial release 🎉 ## Meta * Version **1.2.0** * Last updated **දින 5 ago** * Active installations **300+** * WordPress version ** 6.6 or higher ** * Tested up to **6.9.4** * PHP version ** 7.4 or higher ** * Language * [English (US)](https://wordpress.org/plugins/blablablocks-slider-block/) * Tags * [carousel](https://si.wordpress.org/plugins/tags/carousel/)[Gutenberg block](https://si.wordpress.org/plugins/tags/gutenberg-block/) [image slider](https://si.wordpress.org/plugins/tags/image-slider/)[slider](https://si.wordpress.org/plugins/tags/slider/) [slider block](https://si.wordpress.org/plugins/tags/slider-block/) * [Advanced View](https://si.wordpress.org/plugins/blablablocks-slider-block/advanced/) ## Ratings 5 out of 5 stars. * [ 1 5-star review ](https://wordpress.org/support/plugin/blablablocks-slider-block/reviews/?filter=5) * [ 0 4-star reviews ](https://wordpress.org/support/plugin/blablablocks-slider-block/reviews/?filter=4) * [ 0 3-star reviews ](https://wordpress.org/support/plugin/blablablocks-slider-block/reviews/?filter=3) * [ 0 2-star reviews ](https://wordpress.org/support/plugin/blablablocks-slider-block/reviews/?filter=2) * [ 0 1-star reviews ](https://wordpress.org/support/plugin/blablablocks-slider-block/reviews/?filter=1) [Your review](https://wordpress.org/support/plugin/blablablocks-slider-block/reviews/#new-post) [See all reviews](https://wordpress.org/support/plugin/blablablocks-slider-block/reviews/) ## Contributors * [ lubus ](https://profiles.wordpress.org/lubus/) * [ Ajit Bohra ](https://profiles.wordpress.org/ajitbohra/) * [ Punit Verma ](https://profiles.wordpress.org/punitv342/) ## Support Issues resolved in last two months: 3 out of 3 [View support forum](https://wordpress.org/support/plugin/blablablocks-slider-block/)