XeroWP
GSlider Blocks
GSlider Blocks

GSlider Blocks

5/5 (7 ratings) 1K+ active installs Updated Nov 9, 2026
carouselgutenberglogo carouselsliderslideshow
Download v1.2.2 Plugin Website

The GSlider Blocks plugin allows you to easily add customizable and responsive sliders to your WordPress website. Perfect for both beginners and developers, this plugin provides powerful slider blocks for the WordPress block editor (Gutenberg). Customize slider content, transitions, navigation, and more, while enjoying full control over slider styling and functionality.

Available Blocks

1. Base Slider Block
Create stunning hero sliders with predefined content elements. Perfect for homepage banners, promotional sliders, and featured content showcases.

  • Pre-built slide structure with Title, Subtitle, Description, and Button
  • Transition effects: Slide, Fade, Coverflow, Flip, and Creative in slider mode; Slide and Coverflow in carousel mode
  • Full background image/color support with overlay options
  • Responsive navigation arrows and pagination controls
  • Content alignment and positioning controls
  • Custom spacing and padding options

2. Flexi Content Block
Build completely custom slides using any Gutenberg blocks. Ultimate flexibility for creative slider designs.

  • Use ANY WordPress blocks inside slides (images, text, buttons, galleries, etc.)
  • Full creative control with InnerBlocks support and quick slide add/duplicate toolbar controls
  • Slide effects: Slide, Fade, Coverflow, Flip, and Creative in slider mode; Slide and Coverflow in carousel mode
  • Horizontal and Vertical slider directions with responsive height options (Fixed, Auto, Minimum height)
  • Continuous Marquee mode with per-device toggle, configurable scroll speed, and pause-on-hover behavior
  • Autoplay progress countdown bar with per-device visibility, top/bottom placement, height, and color controls
  • Top and bottom SVG shape dividers with 10 presets, color, height units, opacity, flip, and invert options
  • Interactive cursor follower navigation supporting icon, image, static text, and directional label modes
  • Optional per-device image lightbox (fsLightbox) for Image and Gallery blocks inside slides
  • Native Gutenberg block transforms from Core Cover, Group, and Gallery blocks directly into slides
  • Loop, autoplay, grab cursor, touch/swipe, keyboard, and mousewheel navigation

3. Logo Carousel Block
Display client logos, partner brands, or sponsor images in a beautiful, animated carousel.

  • Easy logo management with drag & drop reordering
  • Hover effects: Grayscale-to-color, opacity, scale, and lift animations
  • Clickable logos with custom URLs and link settings
  • Block Transforms: Convert Core Gallery blocks directly into a Logo Carousel while preserving links, alt text, and captions
  • Tooltips and captions with full styling options
  • Responsive slides per view configuration
  • Lazy loading for optimized performance

4. Image Slider Block
A versatile carousel for displaying images, brand assets, or partner logos with advanced interactive features.

  • Lightbox Support: Responsive per-device toggle (Desktop, Tablet, Mobile) to view images in a full-screen overlay or open custom links when disabled
  • Custom Tooltips: Add descriptive hover text with complete styling control (typography, colors, position)
  • Clickable Images: Link each image to custom internal or external URLs
  • Block Transforms: Convert Core Gallery blocks directly into an Image Slider while keeping alt text, captions, and links
  • Caption Support: Display and style image captions for better context
  • Responsive Design: Fully customizable columns and spacing for Desktop, Tablet, and Mobile
  • Transitions: Slide and Coverflow effects powered by Swiper.js

5. Testimonial Block
Showcase customer testimonials, reviews, and feedback in a beautiful, interactive slider or carousel layout with star ratings.

  • Author Info: Display author name, designation, and customizable avatar image
  • Star Ratings: SVG-based star ratings with fractional support (e.g. 4.5 stars) or custom rating images
  • Quote Icon: Choose between SVG icon or custom uploaded image for quote decoration
  • Flexible Content Ordering: Drag to reorder content sections (quote, content, rating, author)
  • RichText Editing: Edit title, testimonial text, author name, and designation directly in the editor
  • Per-slide Background: Individual background color, gradient, and image with overlay and opacity controls
  • Responsive Design: Fully customizable columns and spacing for Desktop, Tablet, and Mobile
  • Transitions: Slide, Fade, Coverflow, Flip, and Creative in slider mode; Slide and Coverflow in carousel mode

Key Features

  • Multiple Transition Effects: Slide, Fade, Coverflow, Flip, and Creative (Base Slider, Flexi Content, and Testimonial in slider mode); Slide and Coverflow in carousel mode and for Image Slider and Logo Carousel
  • Fully Responsive: Separate settings for Desktop, Tablet, and Mobile
  • Navigation Controls: Customizable arrows (icons or images), pagination (bullets, fraction, progressbar), autoplay progress bar, and interactive cursor follower navigation
  • Advanced Layouts & Transforms: Continuous marquee ticker mode, vertical direction, SVG shape dividers, and one-click Core Gallery, Cover, and Group block transforms
  • Performance Optimized: Built with Swiper.js for smooth, hardware-accelerated animations
  • Accessibility Ready: Keyboard navigation, ARIA labels, and touch support
  • Custom Styling: Full control over colors, typography, spacing, borders, and shadows
  • Google Fonts: Built-in typography options with Google Fonts integration

Support

If you have any questions, please email us at [email protected]

Source Code & Build Instructions

The uncompiled, human-readable source code (blocks, React components, scripts, build config) is publicly available at https://github.com/noruzzamans/gslider-blocks. The build/ directory in this plugin is generated from that source.

To build and compile the production assets from source:
0. Clone the repository: git clone https://github.com/noruzzamans/gslider-blocks
1. Install dependencies: npm install and composer install
2. Compile production assets: npm run build

Contributing & Community

GSlider Blocks is 100% open-source software! We warmly welcome community contributions, bug reports, and feedback:

  • GitHub Repository: https://github.com/noruzzamans/gslider-blocks
  • Contribution Guide: https://github.com/noruzzamans/gslider-blocks/blob/main/CONTRIBUTING.md
  • Browse Good First Issues: https://github.com/noruzzamans/gslider-blocks/issues?q=is%3Aissue+is%3Aopen+label%3A%22good+first+issue%22
  • Interactive Component Storybook: https://noruzzamans.github.io/gslider-blocks/

AI Assistant & Developer Tooling

GSlider Blocks provides an official, zero-cloud-cost Model Context Protocol (MCP) server for modern AI coding assistants (Claude Desktop, Cursor IDE, Antigravity, VS Code / Cline).

Developers and designers can inspect block schemas, generate validated slider markup, and load starter design templates locally:

  • Official NPM Package: https://www.npmjs.com/package/@gslider/mcp-server
  • Instant NPX Runner: npx -y @gslider/mcp-server
  • MCP Developer Documentation: https://github.com/noruzzamans/gslider-blocks/tree/main/packages/mcp-server

Third-Party Libraries

This plugin bundles and uses the following open-source third-party libraries:
* Swiper.js (v11.x)
– Source: https://swiperjs.com/
– Repository: https://github.com/nolimits4web/swiper
– License: MIT License (https://github.com/nolimits4web/swiper/blob/master/LICENSE)
* fslightbox (v3.7.4, free/basic version)
– Source: https://fslightbox.com/ (npm: https://www.npmjs.com/package/fslightbox)
– License: MIT License (https://github.com/banthagroup/fslightbox/blob/master/LICENSE)
* Font Awesome Free SVG Icons (v6.x)
– Source: https://fontawesome.com/
– License: CC BY 4.0 (https://creativecommons.org/licenses/by/4.0/)
* Appsero Client (v2.0.7)
– Source: https://github.com/Appsero/client
– License: MIT License (https://github.com/Appsero/client/blob/develop/composer.json)

External Services

This plugin may connect to or load resources from external third-party services in the following scenarios:

  1. Google Fonts API

    • Service URL: https://fonts.googleapis.com
    • Purpose: Dynamically loads Google Web Fonts selected by the user in the block typography settings to render custom slider fonts.
    • Data Sent: Only standard HTTP request headers (font family, weight variants, user agent) are sent by the browser. No personal identifiable user information is sent or stored.
    • Terms & Privacy:
      • Terms of Service: https://developers.google.com/fonts/terms
      • Privacy Policy: https://policies.google.com/privacy

  2. Appsero Telemetry & Diagnostics (Opt-in)

    • Service URL: https://api.appsero.com
    • Purpose: Used for plugin diagnostics, crash analytics, and feature usage to help improve the plugin.
    • Consent: Telemetry is strictly opt-in and requires explicit user consent upon activation. Users can decline or deactivate tracking at any time.
    • Terms & Privacy:
      • Terms & Privacy Policy: https://appsero.com/privacy-policy/