LaraGrape uses Filament 3 to provide a modern, responsive admin interface for managing your website content and configuration.

http://your-site.test/admin

php artisan make:filament-user

Follow the prompts to create your admin credentials.

Location: Pages in the admin navigation

Features:

• ✅ Create Pages: Build new pages with visual editor
• ✅ Edit Pages: Modify existing pages
• ✅ Page List: View all pages with search and filters
• ✅ Publishing: Control page visibility
• ✅ SEO Management: Meta tags and descriptions

Page Editor Tabs:

• Basic Info: Title, slug, meta information
• Visual Editor: GrapesJS drag-and-drop interface
• Content: Raw HTML content editing
• SEO: Meta tags, Open Graph, Twitter Cards

Location: Custom Blocks in the admin navigation

Features:

• ✅ Visual Block Builder: Create blocks with live preview
• ✅ HTML/CSS/JS Editors: Separate tabs for each language
• ✅ Category Management: Organize blocks by type
• ✅ Active/Inactive Toggle: Control block availability
• ✅ Sort Order: Control block display order

Block Builder Interface:

• HTML Tab: Structure and content
• CSS Tab: Styling and animations
• JavaScript Tab: Interactivity and behavior
• Preview Tab: Live preview of the block

Location: Site Settings in the admin navigation

Features:

• ✅ Grouped Settings: Organized by category
• ✅ Color Pickers: Visual color selection
• ✅ File Uploads: Logo and image management
• ✅ Rich Text Editors: Formatted content
• ✅ Toggle Switches: Boolean settings

Setting Categories:

• General: Site name, contact info, address
• Header: Logo, colors, navigation settings
• Footer: Footer content, social links
• SEO: Meta tags, analytics
• Social: Social media URLs
• Advanced: Custom CSS, JavaScript

Location: Tailwind Config in the admin navigation

Features:

• ✅ Color Palette: Primary, secondary, and accent colors
• ✅ Typography: Font families, sizes, weights
• ✅ Spacing: Custom spacing scale
• ✅ Dark Mode: Dark theme configuration
• ✅ Custom CSS: Additional styles

Configuration Tabs:

• Basic Info: Name, description, active status
• Colors: Primary color palette and additional colors
• Typography: Font settings and line heights
• Spacing & Layout: Spacing units and breakpoints
• Custom CSS: Additional styles
• Advanced: Dark mode, animations, performance

• Responsive Design: Works on all devices
• Dark/Light Mode: Toggle between themes
• Fast Loading: Optimized for performance
• Intuitive Navigation: Easy to find what you need

• Drag & Drop: Visual content management
• Live Preview: See changes in real-time
• Auto-save: Never lose your work
• Keyboard Shortcuts: Power user features

• Clean Code: Well-structured resources
• Extensible: Easy to add new features
• Customizable: Modify to fit your needs
• Documented: Clear code comments

File: app/Filament/Resources/PageResource.php

Key Features:

• Tabbed interface for different editing modes
• GrapesJS integration for visual editing
• SEO management tools
• Publishing controls

Methods:

• form(): Define the form structure
• table(): Define the list view
• getPages(): Define available pages

File: app/Filament/Resources/CustomBlockResource.php

Key Features:

• Visual block builder interface
• Live preview functionality
• Category management
• Active/inactive controls

File: app/Filament/Resources/SiteSettingsResource.php

Key Features:

• Grouped settings interface
• Dynamic form fields
• File upload capabilities
• Color picker integration

File: app/Filament/Resources/TailwindConfigResource.php

Key Features:

• Comprehensive theme configuration
• Color palette management
• Typography settings
• CSS generation

Create new Filament resources for additional functionality:

php artisan make:filament-resource YourModel

Modify resource files to add custom functionality:

// In PageResource.php
public static function form(Form $form): Form
{
    return $form
        ->schema([
            // Your custom form fields
        ]);
}

Create custom actions for bulk operations:

// In PageResource.php
public static function table(Table $table): Table
{
    return $table
        ->actions([
            Tables\Actions\EditAction::make(),
            Tables\Actions\DeleteAction::make(),
            // Your custom actions
        ]);
}

php artisan make:filament-user

Planned features for user role management:

• Admin: Full access to all features
• Editor: Can edit pages and blocks
• Author: Can create and edit their own content
• Viewer: Read-only access

Current permissions:

• Full Access: Admin users have access to everything
• Page Management: Create, edit, delete pages
• Block Management: Create, edit, delete blocks
• Settings Management: Modify site settings
• Theme Management: Configure Tailwind themes

The admin panel includes a dashboard with:

• Recent Pages: Latest created/updated pages
• Quick Stats: Page count, block count
• System Status: Laravel and package versions
• Quick Actions: Create new pages, blocks

Modify app/Filament/Pages/Dashboard.php to customize:

public function getHeaderWidgets(): array
{
    return [
        // Your custom widgets
    ];
}

• Use Visual Editor: Leverage GrapesJS for easy content creation
• Create Reusable Blocks: Build custom blocks for repeated content
• Organize Content: Use clear titles and descriptions
• Preview Before Publishing: Always preview changes

• Group Related Settings: Keep related settings together
• Use Descriptive Names: Make settings easy to understand
• Test Changes: Verify settings work as expected
• Backup Configurations: Export important settings

• Optimize Images: Use appropriate image sizes
• Limit Block Complexity: Keep blocks lightweight
• Use Caching: Enable Laravel caching
• Monitor Usage: Watch for performance issues

Can't Access Admin Panel

php artisan filament:install --panels
php artisan make:filament-user

Resources Not Appearing

php artisan filament:cache
php artisan optimize:clear

Editor Not Loading

npm run build
php artisan cache:clear

Enable debug mode in .env:

APP_DEBUG=true

Check logs in storage/logs/laravel.log

• Page Management - Detailed page management guide
• Custom Block Builder - Building custom blocks
• Site Settings - Configuration management
• Tailwind Configuration - Theme management
• API Reference - Service classes and methods

The admin panel provides a powerful, user-friendly interface for managing your LaraGrape website! 🎯

With Filament 3, you get a modern, responsive admin experience that makes content management intuitive and efficient.