Edit Profile Page: Custom Form

Filament 4/5

This project illustrates how to customize the default "Edit Profile" page using standard Filament full-page styling while demonstrating the implementation of two separate forms within a single page layout.

eUHFewoPCfb1NWNfFcrgVaoSI6jVtN-metaOC1lZGl0LXByb2ZpbGUtcGFnZS5wbmc=-

Get the Source Code:

Only This Example

One-time payment

Full source code for Edit Profile Page: Custom Form

Downloadable ZIP file with the source code

Lifetime access to this example

Best value — all 169 examples

FilamentExamples Membership

$99 /year

$199 lifetime

Access to code of all 169 examples

Future new examples and updates included

FilaCheck Pro package licence included

MCP server included

View membership plans

30-day money-back guarantee

How it works

The whole logic for Custom Profile is in the EditProfile custom page.

In the Panel Provider we enable profile feature with the profile() method.

public function panel(Panel $panel): Panel
{
    return $panel
        ->default()
        ->id('admin')
        ->path('admin')
        ->login()
        ->profile()
        // ...
}

We are using Filament Forms feature called multiple forms to add two forms in one page.

In the Panel Provider we modify default settings URL in the userMenuItems() method to use Custom Page.

The FULL tutorial is available after the purchase: in the Readme file of the official repository you would get invited to.