Introduction

Filament CMS is a block-based content management system built on top of Laravel and Filament. It is organized into focused packages that work together to provide a complete CMS experience:

filament-cms-core

The core CMS package. Provides Pages, Sections, Posts, Menus, a block-based content builder via Filament admin panels, and the BlockCaster/BlockCollection DTO system.

filament-cms-livewire

Livewire frontend rendering. Provides page and section components with autoHydrate() for automatic property mapping.

ve-filament-cms

The visual editing package. Enables inline content editing directly on the frontend pages.

What You Can Build

With Filament CMS, you can:

Create pages composed of reusable sections with drag-and-drop ordering
Build sections using a block-based content builder (headings, paragraphs, rich text, images, custom blocks)
Manage blog posts with categories, tags, and media
Build navigation menus with nested items
Edit content visually by clicking directly on frontend elements
Reuse content components across multiple pages

Who This Documentation Is For

This documentation is organized into three audiences:

| Audience | Focus | |----------|-------| | Administrators | Managing content, pages, posts, menus, users, and settings via the admin panel | | Editors | Creating and editing content using the editor panel and visual editing tools | | Developers | Building pages, sections, content blocks, and integrating the CMS into Laravel applications |

Architecture at a Glance

graph TD
    A[Page] -->|has many| B[Section]
    B -->|contains| C[Content Blocks]
    C -->|resolved by| D[BlockCaster]
    D -->|produces| E[BlockCollection]
    E -->|rendered by| F[Livewire Component]
    F -->|with| G[Visual Editing]

A Page is a URL-routable entity (like /about or /contact).

A Section is a reusable content block that belongs to one or more pages. It stores its content as JSON.

A Content Block is a single unit of content within a section (like a heading, paragraph, or hero block).

BlockCaster is an Eloquent cast that automatically transforms JSON into typed BlockCollection objects.

BlockCollection provides typed access to blocks with first(), all(), and has() methods.

A Livewire Component is the frontend PHP class that renders the section's content into HTML. The base class provides autoHydrate() for automatic property mapping.

Visual Editing allows authorized users to click on rendered frontend elements and edit them inline.

Package Paradigm

Filament CMS follows a separation of concerns architecture:

filament-cms-core is the Filament plugin that provides the admin dashboard, data models, and content resolution (BlockCaster, BlockCollection, BlockData). It is frontend-agnostic.
filament-cms-livewire is a Laravel package that provides Livewire-specific frontend rendering with autoHydrate(). It depends on the core package.
ve-filament-cms-livewire provides visual editing capabilities (InlineEditForm, VisualEditor, source maps). It depends on both core and Livewire packages.

This means you can use the core CMS dashboard with any frontend technology — Livewire, Inertia, or even a headless API.

Key Concepts

Three-tier content: Page → Section → Content Block
BlockCaster: Eloquent cast that transforms JSON to BlockCollection
BlockCollection: Typed container with first(), all(), has() methods
autoHydrate: Automatic property mapping from BlockData to component properties
Source maps: Each rendered HTML element carries metadata tracing it back to its database origin
Block-based builder: Content is built using Filament's Builder field with custom block types
Schema-extracted labels: Field labels auto-extracted from ContentBlock schemas