DEV Community

Cover image for Add a sidebar with options in a Filament resource
Sergio Peris
Sergio Peris

Posted on • Originally published at sertxu.dev

Add a sidebar with options in a Filament resource

Using Filament you can add a sidebar in your resource create and edit views.

Here you can see what I see when I'm writing a new post:

This layout is created using the Split component. Inside it I have two Section components, one for each column. The second Section has the grow property disabled, so it takes the minimum space required.

Also, the Split component has a xl breakpoint, if the screen is lower than that a single column layout will be shown.

The schema has by default a two column grid, so make sure your Split component has the column span set to full so it uses all the horizontal available space.

public static function form(Form $form): Form
{
    return $form
        ->schema([
            Forms\Components\Split::make([
                Forms\Components\Section::make([
                    Forms\Components\TextInput::make('title')
                        ->required(),
                ]),

                Forms\Components\Section::make([
                    Forms\Components\DateTimePicker::make('published_at')
                        ->nullable(),
                ])->grow(false),
            ])->from('xl')->columnSpan('full');
        ]);
}
Enter fullscreen mode Exit fullscreen mode

Top comments (0)