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 [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/

There are no prerequisites for installing GSlider Blocks. You can follow the steps below to complete the installation.

Automatic Installation

1. Go to Plugins > Add New screen from your WordPress website dashboard.
2. Search for GSlider Blocks.
3. Install and activate the plugin, that’s it!

Does the plugin come for free?

Yes, it’s completely free.

Can I customize the appearance of each slide individually?

Yes, each slide can be customized independently with different content, backgrounds, and styling options.

Does GSlider Blocks work with any WordPress theme?

Yes, GSlider Blocks is designed to work with any WordPress theme that supports the block editor.

What is the difference between Base Slider and Flexi Content?

Base Slider has pre-built content elements (title, subtitle, description, button) for quick setup. Flexi Content allows you to use any Gutenberg blocks inside slides for complete creative freedom.

Why do my slides show overlapping content with Creative, Coverflow, or Flip effects?

These are 3D transition effects where slides are stacked in layers. If your slides have transparent backgrounds, content from slides behind will show through. To fix this, add a background color or background image to each slide in your slider settings.

Where can I explore the design system and UI components?

You can inspect all 23 isolated Gutenberg block controls, responsive breakpoints, and design tokens in our interactive Storybook explorer:
https://noruzzamans.github.io/gslider-blocks/

1.2.1 – November 1, 2026

• Performance: Optimized Largest Contentful Paint (LCP) with high-priority slide image preloading and deferred non-critical script execution.
• Performance: Accelerated slider transitions with GPU-enforced CSS hardware acceleration and pre-initialized slide flex rows to eliminate Cumulative Layout Shift (CLS).
• Security: Implemented strict Content Security Policy (CSP) nonce filters for inline styles and scripts, hardening compliance with enterprise security headers.
• Accessibility: Restored visible keyboard focus rings on navigation arrows per WCAG 2.4.7 guidelines.
• Accessibility: Added support for prefers-reduced-motion media queries and enabled keyboard focus tooltips on :focus-within.
• Accessibility: Enhanced screen reader ARIA labels across pagination containers and sortable slider controls.
• Swiper Engine: Fixed active slide desynchronization in infinite loop mode by switching from activeIndex to realIndex for duplicate slides.
• Block Fixes: Corrected rating star gap units and desktop fallback handling in Testimonial Slider.
• Block Fixes: Resolved tablet background hover styling in Logo Carousel and localized button placeholders in Base Slider.
• Block Fixes: Restored core Additional CSS classes (customClassName) support on frontend wrapper in Image Slider and all blocks.
• Admin & Architecture: Cleaned up obsolete dashboard endpoints and hardened REST API routing.
• MCP AI Ecosystem: Officially published @gslider/mcp-server on NPM with zero-install npx support, model context protocol tools, and GitHub Actions trusted publishing.
• Maintenance: Cleaned up unused imports, dead variables, and refined code documentation across block components.
• Props: Heartfelt thanks to all community contributors and WordPress.org forum reporters who helped shape this release: @huzaifaalmesbah, @hmbashar, @Nethsara14, @Pushkar-Shahi, @rejaulalomkhan, @Zhiyilang, @blank-0007, @p00jitha, @Aaqibhafeezkhan, @Sinkleberg, @dbdefault, @ect2000, @irfat-ifti, @madhavidayma21, @mahender9390, @tu-lasizzzz, @devmuhib, @ateliercommodore, @jrevillini.

1.2.0 – October 19, 2026

• Storybook Design System: Integrated 23 isolated Gutenberg UI controls with live interactive explorer (https://noruzzamans.github.io/gslider-blocks/).
• Accessibility: Integrated @storybook/addon-a11y with automated WCAG 2.1 AA accessibility auditing across all inspector controls.
• Architecture: Native Gutenberg block patterns, PSR-4 singleton architecture, and decoupled headless REST API serialization (/wp-json/gslider/v1/blocks/).
• Admin Dashboard: Streamlined modern admin dashboard with live metrics, quickstart guide, and block toggles.
• MCP AI Integration: Built-in local Model Context Protocol server for AI coding assistants.
• Security: Eliminated dynamic CSS file generation in wp-content/uploads/ in favor of safe, block-scoped inline styles rendered via wp_add_inline_style().
• Security: Implemented strict CSS sanitization and selector scoping to prevent arbitrary CSS injection, rejecting disallowed selectors and dangerous CSS rules.
• Security: Fully cleaned up legacy custom CSS attributes and removed unused code editor dependencies across all blocks.
• Security: Bundled Font Awesome icon library locally within the plugin, completely removing runtime remote asset fetching from external repositories.
• Documentation: Fixed 404 broken URLs in readme.txt for Appsero license and privacy policy links to valid endpoints.

1.1.9 – October 14, 2026

• Security: Removed custom CSS input editor and arbitrary code insertion across all blocks to strictly comply with WordPress.org security guidelines.
• Security: Sanitized dynamic CSS output via wp_strip_all_tags() and strict protocol/tag filtering in StyleGenerator.
• Compatibility: Removed deprecated libxml_disable_entity_loader() calls in SVG validator in favor of secure LIBXML_NONET flag.
• Compatibility: Fixed PHP parse issues on earlier PHP versions by removing private class constants, void return types, and trailing function-call commas.
• Compatibility: Updated minimum declared PHP version to PHP 7.4.
• Library Update: Upgraded appsero/client from v2.0.4 to v2.0.7.
• Documentation: Added dedicated sections for source repository, build instructions, third-party libraries, and external services disclosure.

1.1.8 – August 20, 2026

• Compliance: Updated and refactored codebase to fully adhere to all WordPress.org Plugin Directory Guidelines and Security Standards.
• Security: Hardened SVG upload validation with robust XXE injection protection and case-insensitive XSS attribute scanning.
• Security: Enhanced input sanitization, data validation, and output escaping across all blocks and controls.
• Optimization: Optimized code structure and resolved all errors/warnings per WordPress Plugin Check (PCP) requirements.
• Fix: Restored PHP 7.x compatibility (replaced PHP 8.0+ str_contains() with strpos()).
• Fix: Wrapped all error_log() calls in WP_DEBUG checks per WordPress development standards.
• Fix: Removed deprecated load_plugin_textdomain() call (auto-loaded by WordPress.org since WP 4.6).
• Optimization: Cleaned up redundant admin assets and optimized script loading for better performance.

1.1.7 – May 10, 2026

• Added Testimonial Slider block with Swiper.js integration
• Author Info: Display author name, designation, and customizable avatar image
• Star Rating: SVG-based star ratings with fractional support (e.g. 4.5 stars)
• Custom Rating Images: Upload custom SVG or image for rating icons
• Quote Icon: Choose between SVG icon or custom 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

1.1.6 – February 9, 2026

New Block: Image Slider
– Added Image Slider block with Swiper.js integration
– 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

1.1.5 – December 30, 2025

Fixed: Fade effect initial load glitch
– Resolved an issue where the first slide would briefly animate from right to left when using the fade effect on page load
– Improved slider initialization to disable transitions during initial positioning
– Fix applies to both wrapper and individual slide elements for consistent behavior

1.1.4 – December 19, 2025

New: SVG Icons support for toolbar actions
– Icons are now consistent across Logo Carousel and Image Slider blocks
– Improved code maintainability with single-source icon management

1.1.3 – December 16, 2025

New Block: Logo Carousel
– Added fully-featured Logo Carousel block with Swiper.js integration
– Logo Management: Add, remove, duplicate, and reorder logos with drag & drop
– Advanced Carousel Controls: Autoplay, infinite loop, navigation arrows, pagination (bullets/fraction/progressbar)
– Responsive Settings: Configure slides per view, spacing, and speed for Desktop, Tablet, and Mobile
– Logo Styling: Customizable hover effects including grayscale-to-color transition, opacity, scale, and lift animations
– Logo Links: Enable clickable logos with custom URLs, target, and rel attributes
– Tooltips: Add custom tooltip text with full styling controls (typography, colors, positioning, spacing, borders)
– Captions: Display logo captions with complete styling options
– Responsive Visibility: Show/hide individual logos on specific devices
– Vertical Alignment: Control logo positioning (top, middle, bottom) within slides
– Performance: Built-in lazy loading support for optimized page speed
– Navigation: Customizable arrow icons/images with flexible positioning (inside/outside)
– Accessibility: Keyboard navigation, mousewheel control, and ARIA labels
– Google Fonts: Full support for custom typography with Google Fonts integration

1.1.2 – December 04, 2025

• Added: keyboard Navigation control

1.1.1 – November 15, 2025

• Fixed: Minor CSS issues

1.1.0 – October 11, 2025

• Fixed: Fixed-height mode now uses the tallest (max-content) slide to set a uniform slider and background-image height across all Flexi Content items, resolving the navigation “bottom jump”.

1.0.10 – October 02, 2025

• Added: Accessibility improvements — navigation arrows.
• Fixed: Height unit support (px, %, vh, vw, em, rem) and range validation for min/height.
• Fixed: Auto-height alignment issue causing content/navigation jump.

1.0.9 – September 29, 2025

• Added: Minimum height option for all blocks
• Fixed: Minor CSS issues

1.0.8 – September 20, 2025

• Added: Auto height option for all blocks
• Added: Responsive support for navigation and pagination
• Fixed: Minor CSS issues
• Enhanced: Settings layout design

1.0.7 – July 27, 2025

• Added: Base Slider Content Padding Options
• New: Introduced “Flexi Content” block support inside sliders using gslider-blocks/flexi-content-item with dynamic InnerBlocks integration.

1.0.6 – July 16, 2025

• Fixed: Resolved deprecated code issues to ensure compatibility with the latest standards.
• Fixed: Corrected navigation padding issues for improved layout consistency.

1.0.5 – July 07, 2025

Fixed navigation position issues

1.0.4 July 02 2025

Added: Custom Navigation Icon option for sliders.
Users can now set custom left and right navigation icons from the Navigation settings for improved design flexibility.

Added: Support for custom icon images or SVG uploads.
Users can upload their own image files or SVG icons as navigation arrows to better match their site branding and design systems.

1.0.3 June 27 2025

Enhancements:

Updated the Navigation settings panel for greater layout flexibility.

Added Position Type toggle with options: Inside and Outside.

Introduced Arrow Direction dropdown (e.g., Row, Column) for custom navigation layout.

New Offset Controls: Added adjustable Top, Right, Bottom, and Left Offset sliders with support for both % and px units.

Added Gap setting to control spacing between navigation elements, with unit selection and reset capability.

Added Padding control to define spacing around the entire navigation component.

UI Improvements:

Enhanced slider responsiveness and alignment for a smoother user experience.

Grouped controls more logically to improve usability and clarity.

1.0.2 June 21 2025

New Features:
Element Toggles: Added options to show/hide Subtitle, Title, Description, Button, Navigation, and Pagination directly from the General tab.

Style Sections: New grouped style controls for each element (Title, Subtitle, Button, etc.) for easier customization.

Advanced Options: Added Layout, Background, Border & Shadow, and Custom CSS sections under the Advanced tab.

Improvements:
Unified Control Panel: Settings are now context-aware and cleaner, combining all slider options into one organized panel.

Better UX: Enhanced slider item management and updated tab structure (General, Style, Advanced) for smoother workflow.

Replaced the old Z-index-only Advanced tab with full design control options.

Retired the basic layout for a modern, component-based settings UI.

1.0.0

Initial release