gslider-blocks
Modern WordPress Gutenberg slider & carousel blocks with Swiper.js & Headless API. 🎨 Storybook: https://noruzzamans.github.io/gslider-blocks/
Install / Use
claude mcp add noruzzamans -- npx -y github:noruzzamans/gslider-blocksIf the server publishes to npm under a different name, use that package instead — check the repo README.
MCP Server
Model Context Protocol server
Quality Score
Category
Development & EngineeringSupported Platforms
Our assessment of gslider-blocks
gslider-blocks scores 81/100 on our quality scale, 3483rd of 4,654 Development & Engineering skills we index.
Its MCP Server is 21 KB long, well organised into 15 sections with 1 code example: a thorough specification that gives an agent plenty to work with.
It has 10 GitHub stars, so there is little community track record yet; judge it on its content.
Maintenance, license and trust
- The repository was last updated today, so gslider-blocks is actively maintained.
- No license is declared. By default that means all rights are reserved: you can read it, but reusing or redistributing it is not clearly permitted. Ask the author before building on it commercially.
- Its trust signals score 85/100, with 1 caution from licensing, adoption, age or documentation. These come from repository metadata, not a code audit — read the skill file before letting an agent act on it.
gslider-blocks compared with similar skills
All 4 of these similar skills score higher than gslider-blocks; compare them before choosing.
| Skill | Score | Stars | Updated | Format |
|---|---|---|---|---|
| gslider-blocks (this skill)by noruzzamans | 81 | 10 | today | MCP Server |
| Agent-Reachby Panniantong | 100 | 107.2k | 6d ago | CLAUDE.md |
| taste-skillby Leonxlnx | 100 | 106.9k | today | CLAUDE.md |
| headroomby headroomlabs-ai | 100 | 78.5k | 1d ago | CLAUDE.md |
| ai-job-searchby ai-job-search-dev | 100 | 68.4k | today | CLAUDE.md |
Frequently asked questions
- How do I install gslider-blocks?
- Run
claude mcp add noruzzamans -- npx -y github:noruzzamans/gslider-blocks. The install tabs above show the steps for each supported agent. - Which AI agents does gslider-blocks work with?
- It is written for Claude Code and Claude Desktop, as a MCP Server file. Other agents that read the same format can often use it too.
- Is gslider-blocks safe to use?
- It declares no license and scores 85/100 on trust signals. Skills are instructions an agent will follow, so read the file before installing it and do not approve commands you do not understand.
- Is gslider-blocks still maintained?
- The repository was last updated today, so gslider-blocks is actively maintained.
Skill content
View source on GitHub📖 About & Value Proposition
GSlider Blocks is an enterprise-grade Gutenberg carousel library designed for production WordPress websites. Built with modern React, PSR-4 PHP architecture, and Swiper 11, it delivers fluid hardware-accelerated animations, zero block invalidations, and native Headless/AI support without any jQuery dependencies.
Why GSlider Blocks?
| Feature | GSlider Blocks | Typical Slider Plugins |
| :--- | :---: | :---: |
| Gutenberg Native | ✅ Direct block canvas editing | ❌ Shortcodes or detached builders |
| Performance & Weight | ✅ Hardware-accelerated Swiper 11, Zero jQuery | ❌ Heavy jQuery, bloated CSS bundles |
| Dynamic CSS Pipeline | ✅ Scoped, deduplicated CSS generated via dynamic style engine instead of style="" attributes | ❌ Polluted inline style="" attributes |
| Responsive Architecture | ✅ Dedicated 3-device controls (Desktop, Tablet, Mobile) | ⚠️ Generic breakpoint guessing |
| Local AI Integration | ✅ Model Context Protocol (MCP) server ($0 cloud cost) | ❌ No AI schema support |
| Headless Ready | ✅ Dedicated REST API JSON endpoints & serialized blocks | ❌ Shortcode regex parsing needed |
| Code Stability | ✅ Backwards-compatible deprecated.js migrations | ❌ "Block invalidation" white screens on updates |
🎨 Design System & Component Storybook
GSlider Blocks features an enterprise 23-component design system modeled directly after the official WordPress Gutenberg Storybook. Every UI control is completely isolated, WCAG 2.1 AA accessible, responsive-aware (Desktop, Tablet, Mobile), and built strictly for the Gutenberg Inspector sidebar (280px–300px width).
👉 Launch Interactive Storybook Explorer
🧩 What's inside the Storybook:
- 23 Isolated Controls: Responsive range, spacing, typography, colors, gradients, background images, elevation/shadows, layout preset selector, accessible drag-and-drop slide content reordering (
@dnd-kit), and more. - Full Inspector Benchmark Composition: Live simulation of the entire Gutenberg block settings sidebar mounting General, Style, and Advanced tabs in an authentic editor harness.
- Automated Accessibility Testing (
@storybook/addon-a11y): Live Axe-core accessibility auditing on every component state. - Architecture Guidelines & MDX Documentation: Standardized 8-key spacing, 13-key typography, and 3-key color schemas.
📦 Available Blocks
| # | Block | Description | Status | | :-: | :--- | :--- | :-: | | 1 | 🎯 Base Slider | High-impact homepage hero sliders with headings, CTAs & custom backgrounds | ✅ Production | | 2 | 📝 Flexi Content | Full creative freedom: nest any WordPress block inside responsive slides | ✅ Production | | 3 | 🏢 Logo Carousel | Client & partner brand showcases with grayscale hover animations and links | ✅ Production | | 4 | 🖼️ Image Slider | Photography & product carousels with built-in Lightbox and captions | ✅ Production | | 5 | ⭐ Testimonial Carousel | Social proof reviews with fractional star ratings, avatars & quotes | ✅ Production | | 6 | 👥 Team Carousel | Staff & member profiles with bios, social links, and modal popups | 📋 Roadmap | | 7 | 🎥 Video Carousel | Responsive video sliders for YouTube, Vimeo & self-hosted MP4 videos | 📋 Roadmap | | 8 | 📊 Stats Carousel | Animated milestone metric counters and achievement sliders | 📋 Roadmap | | 9 | 🏆 Awards Carousel | Certification badges, client honors & industry recognition sliders | 📋 Roadmap | | 10 | 📰 Post Carousel | Dynamic query slider for WordPress blog posts and Custom Post Types | 📋 Roadmap |
[!TIP]
⭐ Love GSlider Blocks? Give it a Star on GitHub!
If GSlider Blocks saves you time, powers your clients' websites, or helps your open-source journey, please consider giving it a Star on GitHub! It takes only 2 seconds and helps our open-source project gain visibility across the WordPress community.
📚 Developer Guides & Headless / AI Workflows
Looking to extend GSlider Blocks, connect with AI coding assistants, or build modern decoupled/headless web applications? Check out our dedicated developer guides:
| Guide | Description |
| :--- | :--- |
| 🤖 MCP Server & AI Assistant Guide | Connect GSlider to Claude Desktop, Cursor, Antigravity, ChatGPT, and Windsurf with $0 cloud cost. |
| 🌐 Headless WordPress & REST API Guide | Consume /wp-json/gslider/v1/blocks/<id> in Next.js 14/15 App Router, Astro, and Remix with pre-parsed Swiper configs. |
| 🏗️ System Architecture Guide | Learn about the PSR-4 Singleton backend, dynamic CSS generation pipeline, and zero-invalidation deprecation system. |
| 🎣 PHP Hooks & Filters Reference | Complete reference of action hooks and filter hooks for customizing slider markup, styles, CSP nonces, and caches. |
🚀 Quick Installation
Getting started with GSlider Blocks takes less than 30 seconds:
- In your WordPress Admin Dashboard, navigate to Plugins ➔ Add New Plugin.
- Search for "GSlider Blocks".
- Click Install Now and then Activate.
- Open the Gutenberg block editor, type
/gslideror click the+Block Inserter to add any slider block!
[!TIP] 🌐 Live Preview on WordPress.org — Official in-browser interactive preview running directly on WordPress.org!
⚡ Launch Gutenberg Editor in Playground — One-click automated setup with WordPress admin auto-login, GSlider pre-activated, and landing straight in the block editor!
📖 Read Full Quick Start Guide for step-by-step block pattern usage, slash commands, and block configuration.
🤝 Contributing & Local Development
Contributions from both human engineers and AI assistants are welcome! Whether you are building new features, fixing a bug, or polishing documentation:
🌟 First-Time Contributors Welcome!
Looking to make your first open-source contribution or build your WordPress / React portfolio? We have curated step-by-step beginner-friendly tasks with ready-to-run commands: 👉 Browse Good First Issues
Every contributor with a merged PR is automatically inducted into our Contributors hall of fame and mentioned in our official release notes!
📚 Developer Resources & Setup
- 🛠️ Local Development Setup Guide: Setup with LocalWP, Docker (
@wordpress/env), Composer, and Node.js. - ⚡ NPM & Build Workflow: Watch mode (
npm run start), production builds, and admin asset compilation. - 🧪 Testing & Code Quality Matrix: Standalone PHP CLI unit tests (PHP 7.4–8.5 matrix), schema drift tests, and CI checks.
- 📖 CONTRIBUTING.md: Forking, branching, PR title conventions, and AI contribution policy.
- 📚 Developer Handbook: Central developer documentation map and technical guides.
- 🏗️ Architecture Guide: Engineering principles, patterns, and pre-flight developer checklist.
- 📜 CODE_OF_CONDUCT.md: Contributor Covenant v2.1.
- 🛡️ SECURITY.md: Vulnerability disclosure policy
Truncated for display — read the full file on GitHub.
Related Skills
Agent-Reach
107.2kGive your AI agent eyes to see the entire internet. Read & search Twitter, Reddit, YouTube, GitHub, Bilibili, XiaoHongShu — one CLI, zero API fees.
taste-skill
106.9kAgent skills that give coding agents taste: art direction, reference images and a browser check instead of generic AI pages
headroom
78.5kCompress tool outputs, logs, files, and RAG chunks before they reach the LLM. 20% fewer tokens for coding agents, 60-95% fewer tokens for JSON, same answers. Library, proxy, MCP server.
ai-job-search
68.4kThe job search that runs on your machine. AI job application framework built on Claude Code: evaluate postings, tailor CVs, write cover letters, prep interviews. Fork it and own it.
Languages
Trust signals
From repository metadata: license, adoption, age and documentation. Not a code audit — see the Safety scan above for what the skill file itself contains.