The Ultimate CSS Class Management Plugin for WordPress & Gutenberg
Plain Classes Gutenberg is a comprehensive WordPress plugin designed to streamline CSS class management across your entire WordPress website. Whether you’re using Gutenberg blocks, custom themes, or external frameworks like TailwindCSS, this plugin provides powerful tools to manage, organize, and apply CSS classes efficiently.
🎯 Perfect For
- WordPress Developers building custom themes and plugins
- TailwindCSS Users who need better class management
- Design Agencies working with multiple frameworks
- Content Creators who want visual class editing
- Freelancers managing multiple WordPress sites
🚀 Key Features
📚 Intelligent Class Management
- Categorized Storage: Organize classes by type (Imported, Gutenberg, Scanned)
- Import/Export: JSON import/export with merge options
- Bulk Operations: Delete all, replace all, or manage individual classes
- Search & Filter: Find classes quickly with type filtering
- Database Storage: Persistent storage with optimized performance
🔍 Automatic File Scanning
- Smart Detection: Automatically extract CSS classes from your files
- Flexible Selection: Choose specific files or entire directories
- Real-time Updates: Scan on post save (supports keyboard shortcuts)
- Background Processing: Asynchronous scanning prevents slowdowns
- Integration Ready: Works with Scripts Organizer and other tools
✨ Gutenberg Block Autocomplete
- Native Integration: Seamless autocomplete in block editor
- Multi-source Data: Combines imported, scanned, and Winden classes
- Smart Triggers: Support for breakpoint prefixes (sm:, md:, lg:, etc.)
- Performance Optimized: Cached suggestions for fast loading
- Focus Mode: Distraction-free editing with expanded textarea
🔄 Auto-Extraction from Content
- Post Content Scanning: Automatically extract classes from Gutenberg blocks
- Real-time Updates: Classes added as you create content
- Type-specific Scanning: Configure which post types to monitor
- Smart Filtering: Removes duplicates and invalid classes
🎨 Frontend Class Assistant
- Live Visual Editing: Edit CSS classes directly on your frontend with Cmd/Ctrl+Click
- Element Highlighting: Visual red outline shows selected elements
- Smart Navigation: Navigate between parent, child, previous, and next elements
- Breakpoint Support: Toggle responsive classes on/off
- Real-time Preview: See changes instantly as you type
- Autocomplete: Smart suggestions from your class library
🎨 Integration
Works seamlessly with:
- TailwindCSS (including Winden)
- Bootstrap and other CSS frameworks
- Scripts Organizer plugin
- Custom CSS frameworks
- Any WordPress theme