Installation & Setup

Requirements

• PHP 8.4+
• Laravel 13+
• Filament 5+
• PostgreSQL (recommended) or MySQL

Installation

1. Install the Core Package

The core package provides the Filament admin dashboard and data layer:

composer require franc014/filament-cms-core

2. Install the Livewire Frontend Package (for Livewire apps)

If your frontend uses Livewire:

composer require franc014/filament-cms-livewire

Coming soon: franc014/filament-cms-inertia for Inertia.js frontends.

3. Install the Visual Editing Package (Optional)

If you want inline visual editing on the frontend:

composer require franc014/ve-filament-cms-livewire

4. Publish Configuration

Publish the core config:

php artisan vendor:publish --tag=filament-cms-core-config

If using Livewire, also publish its config:

php artisan vendor:publish --tag=filament-cms-livewire-config

This creates:

• config/filament-cms-core.php — content blocks registry
• config/filament-cms-livewire.php — frontend component path

5. Run Migrations

php artisan migrate

This creates the CMS tables:

• pages
• sections
• page_section (pivot with ordering)
• posts, categories, category_post
• menus, menu_items
• components

6. Register the Filament Plugin

In your Filament panel provider (e.g., app/Providers/Filament/AdminPanelProvider.php):

use JFA\FilamentCMSCore\FilamentCMSCorePlugin;

public function panel(Panel $panel): Panel
{
    return $panel
        // ... other config
        ->plugins([
            FilamentCMSCorePlugin::make(),
        ]);
}

7. Configure the CMS

Edit config/filament-cms-core.php:

return [
    'content_blocks' => [
        'default' => [
            // Package defaults: Heading, Paragraph, CustomRichEditor, PostsChooser
        ],
        'custom' => [
            // Your custom blocks go here
            App\CMS\Blocks\Hero::class,
            App\CMS\Blocks\Cta::class,
        ],
    ],
];

Edit config/filament-cms-livewire.php:

return [
    'sections_class_path' => 'App\\Livewire\\',
];

The sections_class_path tells the CMS where to find your frontend Livewire section components.

8. Set Up Permissions (for Visual Editing)

If using ve-filament-cms-livewire, run the installer:

php artisan ve-filament-cms-livewire:install

This command:

• Creates Shield roles: super_admin, admin, frontend_editor, panel_user
• Adds the EditFrontendContent permission
• Patches your User model with required traits
• Optionally creates an editor Filament panel

9. Create an Editor Panel (Optional)

For content editors who should not access the full admin panel, create a dedicated panel:

app/Providers/Filament/EditorPanelProvider.php

namespace App\Providers\Filament;

use Filament\Panel;
use Filament\PanelProvider;
use Filament\Support\Colors\Color;
use JFA\FilamentCMSCore\FilamentCMSCorePlugin;

class EditorPanelProvider extends PanelProvider
{
    public function panel(Panel $panel): Panel
    {
        return $panel
            ->id('editor')
            ->path('editor')
            ->brandName('Content Editor')
            ->colors(['primary' => Color::Blue])
            ->plugins([
                FilamentCMSCorePlugin::make(),
            ]);
    }
}

Register it in config/app.php:

'providers' => [
    // ...
    App\Providers\Filament\EditorPanelProvider::class,
],

Verification

After installation:

1. Log in to /admin — you should see CMS resources in the sidebar
2. Go to CMS → Pages — create a test page
3. Go to CMS → Sections — create a test section
4. Visit the page’s frontend URL — your section should render

Next Steps

• Quick Start Guide
• Building a Page
• Building a Section