WEB LAZER

Any Block Carousel Slider is a Gutenberg carousel slider block plugin that instantly converts supported native WordPress blocks (Query Loop/Post Template, Group, Gallery) into a responsive carousel slider without adding a dedicated block or loading a JavaScript library. Simply enable the “Carousel” toggle in the Gutenberg editor: your content stays 100% native, your DOM stays lightweight, and your Lighthouse performance scores remain intact. This includes WooCommerce product listings rendered via the Query Loop/Post Template block, so you can showcase products without relying on the legacy Products block.
Unlike many all-in-one carousel slider blocks that require you to add a dedicated “Carousel” block and rebuild every slide, Any Block Carousel Slider hooks straight into the Gutenberg blocks you already use. The result: a Query Loop/Post Template, Group, or Gallery block can become a carousel slider in one click, without content duplication or extra maintenance.
<h4>Why Any Block Carousel Slider instead of a dedicated carousel slider block?</h4>
<ul>
<li>WordPress loops without friction – Transform Query Loop and Post Template Gutenberg blocks into a “loop slider” without creating a block per slide.</li>
<li>Familiar editorial experience – Content editors keep the Gutenberg interface they know (patterns, global styles, alignments, inner blocks).</li>
<li>Zero JavaScript on the frontend – Native scroll, <code>scroll-snap</code>, GPU-friendly, no Swiper/Slick bundle to load.</li>
<li>Full compatibility – Works with classic themes and block themes while respecting the structure of your Query Loop/Post Template, Group, and Gallery blocks.</li>
<li>Accessibility + SEO – Keyboard navigation, respects <code>prefers-reduced-motion</code> preferences, clean DOM for crawling.</li>
</ul>
<h4>What you can do in 30 seconds</h4>
<ul>
<li>Blog / Magazine: Display your latest posts in a Query Loop carousel with native filters and badges.</li>
<li>Portfolios & testimonials: Keep your Group blocks and make them scrollable without rebuilding every slide.</li>
<li>Advanced galleries: Turn the Gallery block into a responsive slider while keeping all native settings.</li>
<li>Landing sections: Chain complex sections (image, title, buttons, forms) inside the same Group block and scroll them horizontally.</li>
<li>WooCommerce highlights: Use a Query Loop configured for products (featured, on sale, custom taxonomy) and convert it into a CSS-only product carousel.</li>
</ul>
<h4>Quick comparison</h4>
<ul>
<li>Activation: Any Block Carousel Slider – toggle an existing Gutenberg block. Classic carousel slider blocks – add a dedicated slider block and rebuild every slide.</li>
<li>WordPress loop: Any Block Carousel Slider – works with Query Loop and Post Template blocks without duplication. Competitor carousels – require one block per slide or custom code.</li>
<li>Frontend JavaScript: Any Block Carousel Slider – zero JavaScript, 100% CSS carousel slider. Competitor carousels – load Swiper/Slick and additional scripts.</li>
<li>Performance: Any Block Carousel Slider – lightweight DOM, no external assets. Competitor carousels – multiply files, reflow, and downloads.</li>
<li>Content maintenance: Any Block Carousel Slider – single Gutenberg block to update. Competitor carousels – duplicate content in dedicated slides.</li>
<li>Security & upkeep: Any Block Carousel Slider – no third-party libraries to monitor. Competitor carousels – depend on external JS libraries like Swiper/Slick.</li>
</ul>
<h4>Key features</h4>
<ul>
<li>100% CSS – Smooth carousel slider with <code>scroll-snap</code>, <code>::scroll-button</code>, and <code>::scroll-marker</code>. No script to bundle.</li>
<li>Smart responsive – Automatically handles visible columns, spacing, and control sizes according to WordPress breakpoints (1280, 1024, 782, 600, 480, 375).</li>
<li>Two width modes – Manual mode (fixed column count) and Auto mode (fixed width like 320px) with automatic detection.</li>
<li>Gutenberg block spacing detection – Respects <code>gap</code> and <code>padding</code> values defined in the block editor, including presets.</li>
<li>Theme colors – Buttons automatically inherit your theme’s colors and radii (via CSS variables).</li>
<li>Intact semantics – Your Gutenberg block’s tags and classes remain unchanged: perfect for SEO, schemas, and E2E testing.</li>
<li>WooCommerce friendly – Query Loop can target the <code>product</code> post type, so WooCommerce grids become CSS-only carousels without a dedicated Products block integration.</li>
</ul>
<h4>Native Gutenberg block workflow</h4>
<ol>
<li>Add or edit one of the supported blocks (Gallery, Group, or Query Loop/Post Template).</li>
<li>Enable the Carousel option in the Gutenberg sidebar panel (Layout or Block section depending on the block).</li>
<li>Adjust your usual settings (column count, minimum width, spacing, alignment).</li>
<li>Save: your block becomes a touch-friendly, accessible, and SEO-friendly carousel slider.</li>
</ol>
<h4>Advanced customization</h4>
<ul>
<li>Manual mode (fixed columns) – Ideal for article carousel sliders: 1 to 6 columns depending on screen sizes.</li>
<li>Auto mode (fixed width) – Perfect for card-based sliders (posts, testimonials, product highlights) with pixel-perfect widths like 280px, 320px, or 360px.</li>
<li>Padding and gaps – Automatic management via CSS vars <code>--carousel-padding-*</code>, <code>--wp--style--block-gap</code>.</li>
<li>Themes & <code>theme.json</code> – Override variables to align controls with your design system.</li>
<li>Graceful degradation – If a browser doesn’t support <code>::scroll-button</code>, users keep touch and mouse scrolling.</li>
</ul>
<h4>Technical architecture</h4>
<ul>
<li><code>render_block</code> hook to inject variables based on context (block type, columns, gaps).</li>
<li>Dedicated service for translating labels and help messages.</li>
<li>Separate editor/frontend styles for a transparent Gutenberg experience.</li>
<li>Code organized by PSR-4 services (see <code>ARCHITECTURE.md</code> for details).</li>
</ul>
<h3>How to use the plugin</h3>
<ol>
<li>Install and activate Any Block Carousel Slider from the Plugins screen (Plugins → Add New → search → Install → Activate).</li>
<li>Open the block editor, insert one of the supported blocks (Query Loop/Post Template, Group, Gallery), and toggle the Carousel option in the sidebar.</li>
<li>Ensure the carousel-enabled block sits inside a parent Group (or similar container) so the wrapper can manage overflow, spacing, and arrow positioning properly.</li>
<li>Switch the block layout to Grid then adjust the column count to match your design.</li>
</ol>
<h3>Developer Notes</h3>
<h4>GitHub Repository</h4>
Source code is available on GitHub: <a href="https://github.com/WEBLAZER/native-blocks-carousel" rel="nofollow ugc">https://github.com/WEBLAZER/native-blocks-carousel</a>
<h4>Contributions</h4>
Contributions are welcome! You can: 
* Open a GitHub ticket to report a bug or suggest an improvement. 
* Propose a Pull Request. 
* Help with translation (<code>.po</code> files available in <code>languages/</code>).
<h4>Available hooks</h4>
The plugin uses the <code>render_block</code> hook to dynamically inject CSS variables based on the current block.
<h4>Main CSS Variables</h4>
Layout & Spacing: 
* <code>--wp--style--block-gap</code> – Spacing between elements (responsive). 
* <code>--carousel-min-width</code> – Minimum width for grids in Auto mode. 
* <code>--carousel-grid-item-width</code> – Item width in Manual mode. 
* <code>--carousel-padding-left</code>, <code>--carousel-padding-right</code>, <code>--carousel-padding-top</code>, <code>--carousel-padding-bottom</code> – Detected padding.
Navigation buttons: 
* <code>--carousel-button-bg</code>, <code>--carousel-button-color</code> – Colors auto-detected from theme. 
* <code>--carousel-button-size</code> – Button size (3rem → 1.75rem). 
* <code>--carousel-button-offset</code> – Lateral offset based on container width. 
* <code>--carousel-shadow</code> – Shadow applied to controls.
Markers (dots): 
* <code>--carousel-marker-size</code> – Marker size. 
* <code>--carousel-marker-gap</code> – Horizontal spacing. 
* <code>--carousel-marker-bottom-offset</code> – Vertical position.
Miscellaneous: 
* <code>--carousel-z-index</code> – Display priority (default 999999). 
* <code>--carousel-transition-duration</code>, <code>--carousel-transition-easing</code> – Animation smoothness.
<h3>Credits</h3>
Developed with ❤️ by <a href="https://weblazer.github.io/" rel="nofollow ugc">Arthur Ballan (WEBLAZER)</a>

Any Block Carousel Slider


As a Native Blocks Carousel user, I’m impressed by how simple it is to turn carousels into Gutenberg. It’s the only plugin I know that truly converts any Gutenberg block into a carousel without compromises, while keeping every native feature intact. The interface is intuitive, the animation and navigation options are comprehensive, and the result stays fully responsive. Performance is excellent, and it adapts smoothly to any theme. Special mention for the clear documentation and translation support, which make multilingual setups a breeze. Kudos for this plugin—it delivers exactly what WordPress developers need: a native, clean, lightweight carousel solution.


Turn Any Gutenberg Block into a Carousel Effortlessly

Gutenberg carousel slider block: transform any WordPress block into a responsive carousel with pure CSS. Zero JavaScript.

A WP Life

Sharik Khan

Alexander

zish

mohammadhanif

fkfaisalkhan007

FARAZFRANK

Pathhan

Transform your WordPress website with beautiful, professional image sliders that captivate your visitors and boost engagement!
<iframe loading="lazy" class="youtube-player" width="750" height="422" src="https://www.youtube.com/embed/PzaAXzy21U4?version=3&rel=1&showsearch=0&showinfo=1&iv_load_policy=1&fs=1&hl=en-US&autohide=2&wmode=transparent" allowfullscreen="true" style="border:0;" sandbox="allow-scripts allow-same-origin allow-popups allow-presentation allow-popups-to-escape-sandbox"></iframe>
Ultimate Slider is the most user-friendly and powerful WordPress image slider plugin that helps you create stunning, responsive sliders in minutes – no coding required! Whether you’re showcasing products, portfolios, testimonials, or hero banners, Ultimate Slider makes it effortless.
Trusted by 1.5+ million downloads and rated 4.5 stars by 246+ users, Ultimate Slider is the go-to solution for WordPress users who want professional results without the complexity.
<h3>🚀 Why 100,000+ Websites Choose Ultimate Slider</h3>
Perfect for: 
✓ E-commerce Stores – Showcase products with eye-catching image carousels 
✓ Photographers & Artists – Display portfolios in stunning photo galleries 
✓ Business Websites – Create professional hero banners and promotional sliders 
✓ Bloggers – Highlight featured posts with engaging image sliders 
✓ Real Estate – Present property listings with beautiful image galleries 
✓ Agencies – Impress clients with modern, responsive sliders
<h3>⚡ Key Features That Make Ultimate Slider Stand Out</h3>
🎨 Easy to Use – No Coding Required 
– Drag-and-Drop Builder – Reorder slides effortlessly with intuitive interface 
– WordPress Media Library Integration – Upload images directly from your media library 
– One-Click Shortcode – Copy and paste shortcode anywhere on your site 
– Live Preview – See changes in real-time before publishing 
– Beginner-Friendly – Get started in under 5 minutes with our video tutorial
📱 100% Responsive & Mobile-Optimized 
– Automatically adapts to all screen sizes (desktop, tablet, mobile) 
– Touch-enabled swipe navigation for mobile devices 
– Retina-ready for crystal-clear images on high-resolution displays 
– Optimized for Core Web Vitals and page speed
🎯 Unlimited Creative Freedom 
– Unlimited Sliders – Create as many sliders as you need 
– Unlimited Slides – Add unlimited images to each slider 
– Custom Dimensions – Set custom width and height for any layout 
– Flexible Placement – Use in posts, pages, widgets, or theme templates
⚙️ Powerful Customization Options 
– Transition Effects – Choose between Fade or Slide animations 
– Auto-Play Control – Enable/disable automatic slideshow 
– Adjustable Speed – Control slide transition timing (1-60 seconds) 
– Navigation Styles – Arrows, bullets, thumbnails, or combination 
– Thumbnail Navigation – Display clickable thumbnail previews 
– Custom Colors – Customize navigation colors to match your brand 
– Font Options – Choose from multiple font families 
– Slide Ordering – Display slides in ascending or descending order
🎬 Advanced Slide Features 
– Image Titles & Descriptions – Add text overlays to slides 
– Alt Text Support – Improve SEO and accessibility 
– Custom Links – Make slides clickable (Pro version) 
– Rich Text Editor – Format descriptions with advanced styling 
– Lazy Loading – Optimize performance with lazy image loading
🔧 Developer-Friendly 
– Clean, semantic HTML5 code 
– Custom CSS support for advanced styling 
– PHP shortcode for theme integration: <code><?php echo do_shortcode('[URIS id=123]'); ?></code> 
– Widget support for sidebar sliders 
– Translation-ready with .pot file included
🌍 Multilingual & Translation Ready 
Available in 15+ languages including: 
Arabic, Chinese, Dutch, Finnish, French, German, Hindi, Hungarian, Indonesian, Italian, Japanese, Polish, Portuguese, Russian, Spanish 
Easily translate to any language using .pot file
⚡ Performance Optimized 
– Lightweight code (minimal impact on page load speed) 
– Optimized for Google Core Web Vitals 
– Lazy loading support for faster initial page load 
– Clean, efficient JavaScript and CSS 
– No jQuery conflicts with other plugins
🔒 Secure & Well-Maintained 
– Regular security updates and vulnerability patches 
– Compatible with latest WordPress versions 
– Follows WordPress coding standards 
– Active support and development
<h3>🎯 Perfect Use Cases</h3>
1. Hero Banners & Headers 
Create stunning full-width hero sliders that grab attention and showcase your best content above the fold.
2. Product Showcases 
Display your products, services, or offerings in an engaging carousel that encourages clicks and conversions.
3. Portfolio Galleries 
Showcase your work, projects, or case studies in a professional, visually appealing format.
4. Testimonial Sliders 
Build trust by rotating customer testimonials and reviews in an attractive slider.
5. Before/After Galleries 
Perfect for showing transformations, renovations, or progress with side-by-side comparisons.
6. Featured Content 
Highlight your best blog posts, news, or announcements in a rotating slider.
<h3>📊 How to Create Your First Slider in 3 Easy Steps</h3>
Step 1: Install and activate Ultimate Slider 
Step 2: Go to “Ultimate Slider” in your WordPress dashboard, create a new slider, and upload images 
Step 3: Copy the shortcode <code>[URIS id=123]</code> and paste it into any page, post, or widget
That’s it! Your beautiful responsive slider is live.
<h3>🎁 Free vs Pro Version</h3>
Free Version Includes: 
✓ Unlimited sliders and slides 
✓ Responsive design 
✓ Drag-and-drop interface 
✓ 2 transition effects (Fade & Slide) 
✓ Navigation arrows and bullets 
✓ Thumbnail navigation 
✓ Auto-play with adjustable speed 
✓ Custom dimensions 
✓ Image titles and descriptions 
✓ Color customization 
✓ SEO-friendly alt text
<a href="http://wpfrank.com/account/signup/ultimate-responsive-image-slider-pro/" rel="nofollow ugc">Upgrade to Pro</a> for Premium Features: 
✓ 5 Elegant Design Layouts – Choose from multiple professional templates 
✓ Advanced Transition Effects – 10+ stunning animation styles 
✓ Clickable Slides – Add custom links to any slide 
✓ 2 Lightbox Styles – Open images in beautiful lightbox popups 
✓ 500+ Google Fonts – Complete typography control 
✓ Advanced Slide Ordering – Multiple sorting options 
✓ Priority Support – Get help from our expert team 
✓ Regular Updates – New features added frequently
<a href="http://wpfrank.com/demo/ultimate-responsive-image-slider-pro/" rel="nofollow ugc">View Pro Demo</a> | <a href="http://wpfrank.com/account/signup/ultimate-responsive-image-slider-pro/" rel="nofollow ugc">Upgrade to Pro</a>
<h3>💬 What Users Are Saying</h3>
<blockquote>
“The easiest slider plugin I’ve ever used. Works perfectly out of the box!” – ⭐⭐⭐⭐⭐
“Lightweight and fast. Doesn’t slow down my website like other slider plugins.” – ⭐⭐⭐⭐⭐
“Great support team! They helped me customize the slider exactly how I wanted.” – ⭐⭐⭐⭐⭐
</blockquote>
<h3>🆘 Need Help?</h3>
<ul>
<li><a href="http://wpfrank.com/" rel="nofollow ugc">Documentation</a> – Comprehensive guides and tutorials</li>
<li><a href="https://www.youtube.com/watch?v=PzaAXzy21U4" rel="nofollow ugc">Video Tutorial</a> – Step-by-step video walkthrough</li>
<li><a href="https://wordpress.org/support/plugin/ultimate-responsive-image-slider" rel="ugc">Support Forum</a> – Get help from our community</li>
<li><a href="http://wpfrank.com/" rel="nofollow ugc">Contact Us</a> – Direct support for Pro users</li>
</ul>
<h3>🔥 Get Started Today!</h3>
Join thousands of satisfied users who have transformed their websites with Ultimate Slider. Download now and create your first stunning slider in minutes!
<h3>🌟 Language Translation Contributors</h3>
Hindi by Faraz Khan 
Spanish by <a href="https://profiles.wordpress.org/kuka7466/" rel="nofollow ugc">Kane Martin</a>
Want to contribute a translation? Contact us through the support forum!
<h3>Additional Information</h3>
Plugin Support & Resources
<ul>
<li><a href="http://wpfrank.com/demo/ultimate-responsive-image-slider-pro/" rel="nofollow ugc">Live Demo</a> – See the Pro version in action</li>
<li><a href="http://wpfrank.com/" rel="nofollow ugc">Documentation</a> – Detailed guides and tutorials</li>
<li><a href="https://www.youtube.com/watch?v=PzaAXzy21U4" rel="nofollow ugc">Video Tutorial</a> – Step-by-step video guide</li>
<li><a href="https://wordpress.org/support/plugin/ultimate-responsive-image-slider" rel="ugc">Support Forum</a> – Community support</li>
<li><a href="http://wpfrank.com/account/signup/ultimate-responsive-image-slider-pro/" rel="nofollow ugc">Pro Version</a> – Upgrade to unlock premium features</li>
</ul>
Why Choose Ultimate Slider?
With over 1.5 million downloads and a 4.5-star rating, Ultimate Slider has become the trusted choice for WordPress users worldwide. Whether you’re a beginner or an experienced developer, our plugin offers the perfect balance of simplicity and power.
Key Advantages: 
– No coding skills required 
– Works with any WordPress theme 
– Compatible with all major page builders 
– Regular updates and security patches 
– Active development and support 
– Lightweight and fast 
– SEO-optimized 
– Mobile-responsive 
– Translation-ready
Perfect For: 
– Business websites 
– E-commerce stores 
– Photography portfolios 
– Real estate listings 
– Blog featured posts 
– Product showcases 
– Testimonial displays 
– Before/after galleries 
– Event promotions 
– And much more!
Get Started in Minutes
<ol>
<li>Install the plugin</li>
<li>Create your first slider</li>
<li>Add images</li>
<li>Customize settings</li>
<li>Copy shortcode</li>
<li>Paste anywhere on your site</li>
</ol>
It’s that simple!
Need More Features?
Upgrade to <a href="http://wpfrank.com/account/signup/ultimate-responsive-image-slider-pro/" rel="nofollow ugc">Ultimate Slider Pro</a> for: 
– 5 professional design layouts 
– Advanced animation effects 
– Clickable slides with custom URLs 
– Lightbox integration 
– 500+ Google Fonts 
– Priority support 
– And much more!
<a href="http://wpfrank.com/demo/ultimate-responsive-image-slider-pro/" rel="nofollow ugc">View Pro Demo</a> | <a href="http://wpfrank.com/account/signup/ultimate-responsive-image-slider-pro/" rel="nofollow ugc">Upgrade Now</a>
Join Our Community
Stay updated with the latest features, tips, and updates: 
– Follow us on social media 
– Subscribe to our newsletter 
– Join our support forum 
– Watch our video tutorials
We Value Your Feedback
If you love Ultimate Slider, please <a href="https://wordpress.org/support/plugin/ultimate-responsive-image-slider/reviews/#new-post" rel="ugc">leave us a 5-star review</a>. Your feedback helps us improve and helps other users discover our plugin.
If you encounter any issues or have suggestions, please don’t hesitate to contact us through our <a href="https://wordpress.org/support/plugin/ultimate-responsive-image-slider" rel="ugc">support forum</a>. We’re here to help!
Thank you for choosing Ultimate Slider!

Ultimate Responsive Image Slider


Ultimate Responsive Image Slider is one of the best image slider plugins available for free. The Slider plugin is a responsive image slider for WordPress that allows you to easily create and manage image slideshows on your website. It features a user-friendly interface, multiple transition effects, and the ability to customize the look and feel of the slider. Additionally, it is fully responsive and mobile-friendly, ensuring that your image slideshows will look great on any device. Overall, the URIS plugin is a solid choice for anyone looking to add a responsive image slider to their WordPress website.


Best WordPress Slider Plugin

Create stunning responsive sliders in minutes. Drag-and-drop builder, unlimited sliders, mobile-friendly & SEO optimized!

Any Block Carousel Slider vs Ultimate Responsive Image Slider