Sourav Biswas

<p><strong>PlugVista Carousel Builder Block</strong> adds a powerful and flexible carousel slider to the WordPress block editor. Each slide can hold any Gutenberg block — images, text, buttons, covers, WooCommerce products, and more — giving you complete creative freedom.</p>
<h4>Key Features</h4>
<ul>
<li>Use <strong>any Gutenberg block</strong> as slide content</li>
<li><strong>6 slide transition effects</strong> — Slide, Fade, Coverflow, Flip, Cube, Cards</li>
<li><strong>Built-in Lightbox</strong> — click any image in a slide to open a fullscreen modal with keyboard navigation (Arrow keys, Escape) and captions</li>
<li><strong>Free Mode</strong> — physics-based momentum scrolling without snapping, ideal for logo carousels</li>
<li><strong>Centered Slides</strong> — display the active slide in the center with partial neighbors visible on both sides</li>
<li><strong>Auto Height</strong> — carousel height adapts dynamically to the active slide’s content</li>
<li><strong>Mousewheel / Trackpad Scroll</strong> — navigate slides by scrolling the mouse wheel or trackpad</li>
<li><strong>Keyboard Navigation</strong> — move through slides using the left/right arrow keys</li>
<li>Navigation arrows (toggleable)</li>
<li>Pagination dots (toggleable)</li>
<li>Autoplay with configurable delay, pause-on-hover, and disable-on-interaction options</li>
<li>Infinite loop sliding</li>
<li>RTL (right-to-left) language support</li>
<li>Live multi-column preview in the block editor</li>
<li>Responsive breakpoints — configure slides-per-view for mobile separately</li>
<li>CSS variable theming (theme.json compatible)</li>
<li>On-demand loading — Swiper assets load only on pages that use the carousel</li>
<li>Public JavaScript API for integration with tabs, accordions, and modals</li>
</ul>
<h4>Starter Block Patterns</h4>
<p>Three ready-to-use block patterns are included:</p>
<ul>
<li><strong>Full Width Hero Slider</strong> — full-width cover slides with call-to-action buttons</li>
<li><strong>Testimonials Slider</strong> — quote blocks with autoplay</li>
<li><strong>Logos Carousel</strong> — image-based logo ticker with free mode</li>
</ul>
<h4>CSS Customization</h4>
<p>Style the carousel using CSS custom properties in your theme’s <code>theme.json</code> or Additional CSS:</p>
<ul>
<li><code>--wp--custom--scb--navigation-color</code> — Arrow color</li>
<li><code>--wp--custom--scb--navigation-hover-color</code> — Arrow hover color</li>
<li><code>--wp--custom--scb--navigation-size</code> — Arrow size (height in px)</li>
<li><code>--wp--custom--scb--navigation-sides-offset</code> — Arrow horizontal offset</li>
<li><code>--wp--custom--scb--navigation-alignfull-color</code> — Arrow color for full-width carousels</li>
<li><code>--wp--custom--scb--pagination-bullet-active-color</code> — Active dot color</li>
<li><code>--wp--custom--scb--pagination-bullet-inactive-color</code> — Inactive dot color</li>
<li><code>--wp--custom--scb--pagination-bullet-size</code> — Dot diameter</li>
<li><code>--wp--custom--scb--pagination-bottom</code> — Dot pagination vertical offset</li>
</ul>
<h4>Public JavaScript API</h4>
<p>Integrate with tabs, accordions, modals, and other dynamic layouts that show/hide content:</p>
<pre><code>window.PlugVistaCarouselBuilder.init(container);   // Initialize all carousels inside a container
window.PlugVistaCarouselBuilder.update(container); // Update/re-initialize existing carousels
</code></pre>
<h4>Third-Party Libraries</h4>
<p>This plugin bundles the following third-party library:</p>
<p><strong>Swiper</strong> (https://swiperjs.com/)<br />
License: MIT<br />
Copyright: Vladimir Kharlampidi<br />
Source: https://github.com/nolimits4web/swiper</p>
<p>The full Swiper bundle (v11.2.10, ~154 KB) is included and loaded on-demand only on pages that contain a carousel block.</p>
<h3>Credits</h3>
<p>Developed by <a href="https://sourav.work/" rel="nofollow ugc">Sourav Biswas</a>.</p>
<p>Powered by <a href="https://swiperjs.com/" rel="nofollow ugc">Swiper.js</a> — the most modern mobile touch slider, released under the MIT license.</p>


PlugVista Carousel Builder Block

A carousel slider block with 6 slide effects, built-in lightbox, free mode, keyboard navigation, autoplay, and CSS variable theming.

Isamu Takeda

<p>An overview of the features is below.<br />
– Operate the slider plugins VEGAS2 and SWIPER using the block interface and provide blocks to display on the website.<br />
– Two blocks are bundled: <code>Fade MainView</code> which operates and displays VEGAS2 settings and <code>Slide MainView</code> which operates and displays SWIPER settings.<br />
– <code>Fade MainView</code> selects multiple images from the WordPress media library and displays them one by one. At that time, settings can be made by operating blocks to produce a variety of VEGAS2 effects.<br />
– <code>Slide MainView</code> is set to <code>Design Grorp</code> of <a href="https://ja.wordpress.org/plugins/block-collections/" rel="nofollow ugc">BLOCK COLLECTIONS plugin</a> as the SWIPER slide. Therefore, not only images, but also content such as text and tables can be displayed as SWIPER slides with a variety of effects.</p>
<h3>Related Links</h3>
<ul>
<li><a href="https://github.com/itmaroon/slide-blocks" rel="nofollow ugc">Github</a></li>
<li><a href="https://github.com/itmaroon/slide-blocks/tree/master" rel="nofollow ugc">source code</a></li>
<li><a href="https://github.com/itmaroon/block-class-package" rel="nofollow ugc">block-class-package:GitHub</a>  </li>
<li><a href="https://packagist.org/packages/itmar/block-class-package" rel="nofollow ugc">block-class-package:Packagist</a> </li>
<li><a href="https://www.npmjs.com/package/itmar-block-packages" rel="nofollow ugc">itmar-block-packages:npm</a>  </li>
<li><a href="https://github.com/itmaroon/itmar-block-packages" rel="nofollow ugc">itmar-block-packages:GitHub</a></li>
</ul>
<h3>Arbitrary section</h3>
<ol>
<li>Style settings that may require responsive support can be set separately for desktop mode (displayed on devices with a width of 768px or more) and mobile mode (displayed on devices with a width of 767px or less). To tell which setting is set, when you switch the display mode in the block editor or site editor, “(Desktop)” and “(Mobile)” will be displayed in the side menu display.<br />
Please note that responsiveness for tablet display is not supported.</li>
<li>This plugin depends on the <a href="https://ja.wordpress.org/plugins/block-collections/" rel="nofollow ugc">BLOCK COLLECTIONS plugin</a>. This plugin requires installation and activation in order to use it.</li>
<li>Regarding the display of text, etc., settings are made using WordPress’s internationalization function, so it is possible to display text in multiple national languages. Currently, English and Japanese notation is possible.</li>
<li>The Fade MainVeiw block uses VEGAS2. Regarding licenses, etc., please follow the following terms of use.<br />
<a href="https://github.com/jaysalvat/vegas" rel="nofollow ugc">Vegas – Backgrounds and Slideshows</a><br />
As of April 29, 2024, this plugin has been downloaded and used v.2.5.4.</li>
<li>The Slide MainView block uses SWIPER. Terms and conditions are listed on the next page.<br />
<a href="https://github.com/nolimits4web/swiper" rel="nofollow ugc">Swiper</a><br />
As of May 22, 2024, this plugin has been downloaded and is using v.11.1.3.</li>
<li>PHP class management is now done using Composer.<br />
<a href="https://github.com/itmaroon/block-class-package" rel="nofollow ugc">GitHub</a><br />
<a href="https://packagist.org/packages/itmar/block-class-package" rel="nofollow ugc">Packagist</a><br />
As of May 22, 2024, this plugin has been downloaded and is using v.1.1.1. </li>
<li>I decided to make functions and components common to other plugins into npm packages, and install and use them from npm.<br />
<a href="https://www.npmjs.com/package/itmar-block-packages" rel="nofollow ugc">npm</a><br />
<a href="https://github.com/itmaroon/itmar-block-packages" rel="nofollow ugc">GitHub</a></li>
</ol>


Slide Blocks

This block allows you to control slide plugins and customize the slider.

PlugVista Carousel Builder Block vs Slide Blocks