GSlider Blocks

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
• Slide effects: Slide, Fade, Coverflow, Flip, and Creative in slider mode; Slide and Coverflow in carousel mode
• Responsive height options (Fixed, Auto, Minimum height)
• Loop, autoplay, and touch/swipe support
• 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
• 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: View images in a stunning full-screen overlay
• Custom Tooltips: Add descriptive hover text with complete styling control (typography, colors, position)
• Clickable Images: Link each image to custom internal or external URLs
• 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) and pagination (bullets, fraction, progressbar)
• 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 gsliderblocks@gmail.com

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/