Filament Custom Fields, Columns & Render Hooks | Mohamed Said [ ![Mohamed Said](https://cdn.msaied.com/01KT78WE565VEMM3PSNQAAB0MH.png) Mohamed Said Laravel Backend Engineer ](https://msaied.com) [ Home ](https://msaied.com) [ Projects ](https://msaied.com/projects) [ Articles ](https://msaied.com/articles) [ Certificates ](https://msaied.com/certificates) [ Contact ](https://msaied.com#contact-section) [ ](https://github.com/EG-Mohamed) [ Home ](https://msaied.com) [ Projects ](https://msaied.com/projects) [ Articles ](https://msaied.com/articles) [ Certificates ](https://msaied.com/certificates) [ Contact ](https://msaied.com#contact-section) [ home ](https://msaied.com) [ articles ](https://msaied.com/articles) Advanced Filament: Custom Field Plugins, Custom Columns, and Render Hooks On this page 1. [ Why Extend Filament at the Component Level ](#why-extend-filament-at-the-component-level) 2. [ 1. Custom Form Field Plugin ](#1-custom-form-field-plugin) 3. [ 2. Custom Table Column ](#2-custom-table-column) 4. [ 3. Render Hooks for Surgical UI Injection ](#3-render-hooks-for-surgical-ui-injection) 5. [ Packaging It All Together ](#packaging-it-all-together) 6. [ Key Takeaways ](#key-takeaways) ![Advanced Filament: Custom Field Plugins, Custom Columns, and Render Hooks](https://cdn.msaied.com/366/1e40ce8bff9cc5db154e46389e0362e9.png) #filament #laravel #php #filament-plugins Advanced Filament: Custom Field Plugins, Custom Columns, and Render Hooks =========================================================================== 5 Jul 2026 3 min read ![Mohamed Said](https://cdn.msaied.com/01KT78WE565VEMM3PSNQAAB0MJ.jpg) Mohamed Said Table of contents 1. [ 01 Why Extend Filament at the Component Level ](#why-extend-filament-at-the-component-level) 2. [ 02 1. Custom Form Field Plugin ](#1-custom-form-field-plugin) 3. [ 03 2. Custom Table Column ](#2-custom-table-column) 4. [ 04 3. Render Hooks for Surgical UI Injection ](#3-render-hooks-for-surgical-ui-injection) 5. [ 05 Packaging It All Together ](#packaging-it-all-together) 6. [ 06 Key Takeaways ](#key-takeaways) Why Extend Filament at the Component Level ------------------------------------------ Filament ships with a rich set of fields and columns, but production panels inevitably need components that don't exist yet — a colour-swatch picker, a rich diff viewer, a sparkline column. The wrong move is to fork core or paste raw Blade into a resource. The right move is to build a proper plugin that can be versioned, tested, and shared. This article covers three extension points: a custom **Form field plugin**, a custom **Table column**, and **render hooks** for surgical UI injection. --- 1. Custom Form Field Plugin --------------------------- A Filament field is a class that extends `Filament\Forms\Components\Field` and pairs with a Blade view. ```php // src/Forms/Components/ColourSwatchPicker.php namespace Acme\FilamentColour\Forms\Components; use Filament\Forms\Components\Field; class ColourSwatchPicker extends Field { protected string $view = 'filament-colour::forms.components.colour-swatch-picker'; /** @var array */ protected array $swatches = []; public function swatches(array $colours): static { $this->swatches = $colours; return $this; } public function getSwatches(): array { return $this->swatches; } } ``` The Blade view receives `$field` automatically: ```blade {{-- resources/views/forms/components/colour-swatch-picker.blade.php --}} @foreach ($field->getSwatches() as $colour) @endforeach ``` Register it in your plugin's service provider so auto-discovery works: ```php public function packageBooted(): void { Filament::registerRenderHook('panels::body.end', fn () => ''); // Blade component registration happens via package view namespace } ``` Usage in a resource: ```php ColourSwatchPicker::make('brand_colour') ->swatches(['#ef4444', '#3b82f6', '#22c55e']) ->required(), ``` --- 2. Custom Table Column ---------------------- Custom columns extend `Filament\Tables\Columns\Column` and follow the same view convention. ```php namespace Acme\FilamentColour\Tables\Columns; use Filament\Tables\Columns\Column; class ColourSwatchColumn extends Column { protected string $view = 'filament-colour::tables.columns.colour-swatch-column'; } ``` ```blade {{-- tables/columns/colour-swatch-column.blade.php --}} ``` Because `$getState()` resolves through Filament's normal attribute pipeline, sorting, searching, and `formatStateUsing()` all work without extra effort. ```php ColourSwatchColumn::make('brand_colour') ->label('Brand') ->sortable(), ``` --- 3. Render Hooks for Surgical UI Injection ----------------------------------------- Render hooks let you inject Blade output at named slots across every Filament panel without touching a single core file. They are registered in a service provider or panel provider. ```php use Filament\Support\Facades\FilamentView; use Illuminate\Support\Facades\Blade; FilamentView::registerRenderHook( 'panels::topbar.end', fn (): string => Blade::render(''), ); ``` Available hooks include `panels::body.start`, `panels::sidebar.nav.start`, `panels::page.start`, and many more — check the Filament docs for the full list per version. For hooks that should only fire on specific pages, gate them: ```php use Filament\Pages\Page; FilamentView::registerRenderHook( 'panels::page.end', fn (): string => Blade::render(''), scopes: App\Filament\Resources\OrderResource\Pages\EditOrder::class, ); ``` --- Packaging It All Together ------------------------- Wrap everything in a Spatie Laravel Package Tools plugin: ```php public function configurePackage(Package $package): void { $package ->name('filament-colour') ->hasViews() ->hasConfigFile(); } ``` Filament's own plugin interface (`FilamentPlugin`) lets you hook into panel registration cleanly, giving you access to the panel instance for conditional logic. --- Key Takeaways ------------- - Extend `Field` or `Column` and pair with a namespaced Blade view — no hacks needed. - `@entangle($getStatePath())` is the correct Alpine bridge for two-way field state. - Render hooks are scoped to panels and pages, keeping injection surgical and reversible. - Package everything with Spatie Package Tools; Filament's auto-discovery handles the rest. - Custom columns inherit sorting, searching, and `formatStateUsing()` for free. Found this useful? [ ](https://twitter.com/intent/tweet?url=https%3A%2F%2Fmsaied.com%2Farticles%2Fadvanced-filament-custom-field-plugins-custom-columns-and-render-hooks-1&text=Advanced+Filament%3A+Custom+Field+Plugins%2C+Custom+Columns%2C+and+Render+Hooks) [ ](https://www.linkedin.com/sharing/share-offsite/?url=https%3A%2F%2Fmsaied.com%2Farticles%2Fadvanced-filament-custom-field-plugins-custom-columns-and-render-hooks-1) Frequently Asked Questions ---------------------------- 3 questions Q01 Can a custom Filament field support validation rules like built-in fields? Yes. Because your field extends `Filament\Forms\Components\Field`, you can chain any built-in rule method (`->required()`, `->rules([])`, `->minLength()`) and Filament's form validation pipeline treats it identically to a native field. Q02 How do render hooks differ between Filament v3 and v4? The hook names and the registration API are largely the same, but v4 introduced additional schema-level hooks tied to the unified Schema API. Always check the version-specific hook reference; hooks added in v4 will silently do nothing in a v3 panel. Q03 Is it safe to use Livewire components inside render hooks? Yes, using `Blade::render('<livewire:my-component />')` inside a render hook works, but each call mounts a full Livewire component. Keep them lightweight and avoid mounting the same component on every page load if it carries heavy state. Continue reading More Articles --------------- [ View all ](https://msaied.com/articles) [ ![Domain-Driven Design in Laravel: Value Objects, DTOs, and Actions Without Bloat](https://cdn.msaied.com/377/b5c2aef77aed51ee8694f377085af424.png) laravel ddd architecture ### Domain-Driven Design in Laravel: Value Objects, DTOs, and Actions Without Bloat Learn how to model domain concepts with value objects, DTOs, and single-action classes in Laravel — keeping yo... ![Mohamed Said](https://cdn.msaied.com/01KT78WE565VEMM3PSNQAAB0MJ.jpg) Mohamed Said 6 Jul 2026 4 min read Read ](https://msaied.com/articles/domain-driven-design-in-laravel-value-objects-dtos-and-actions-without-bloat) [ ![What's Missing from Your PHP Development Environment: Meet DDLess](https://cdn.msaied.com/379/baa8990d4c7b46d18498d69d68f9b6d2.png) DDLess PHP Debugging Laravel Tools ### What's Missing from Your PHP Development Environment: Meet DDLess DDLess is a PHP development workbench that brings step debugging, an in-breakpoint playground, and an interact... ![Mohamed Said](https://cdn.msaied.com/01KT78WE565VEMM3PSNQAAB0MJ.jpg) Mohamed Said 6 Jul 2026 3 min read Read ](https://msaied.com/articles/whats-missing-from-your-php-development-environment-meet-ddless) [ ![CQRS in Laravel Without a Framework: Commands, Handlers, and Query Objects](https://cdn.msaied.com/376/bec9da4b7a7ddeee26dac3df6f5d6c44.png) laravel cqrs architecture ### CQRS in Laravel Without a Framework: Commands, Handlers, and Query Objects Skip the heavy CQRS libraries. Learn how to implement commands, command handlers, and query objects in plain L... ![Mohamed Said](https://cdn.msaied.com/01KT78WE565VEMM3PSNQAAB0MJ.jpg) Mohamed Said 6 Jul 2026 3 min read Read ](https://msaied.com/articles/cqrs-in-laravel-without-a-framework-commands-handlers-and-query-objects) [ ![Mohamed Said](https://cdn.msaied.com/01KT78WE565VEMM3PSNQAAB0MH.png) Mohamed Said Laravel Backend Engineer ](https://msaied.com)Senior Backend Engineer specializing in Laravel, scalable SaaS platforms, APIs, and cloud infrastructure. I build secure, high-performance web applications that help businesses grow. Explore - [Home](https://msaied.com) - [Projects](https://msaied.com/projects) - [Articles](https://msaied.com/articles) - [Certificates](https://msaied.com/certificates) - [Contact](https://msaied.com#contact-section) Connect - [ hello@msaied.com ](mailto:hello@msaied.com) - [ +20 109 461 9204 ](tel:+201094619204) © 2026 Mohamed Said. All rights reserved. [ ](https://github.com/EG-Mohamed) [ ](https://www.linkedin.com/in/msaiedm/) [ ](https://wa.me/201094619204) [ ](mailto:hello@msaied.com) [ ](https://drive.google.com/file/u/0/d/1MF20IPRJyzfy32mhEutjL5EpSls0w2Q8/view)