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

Image of Datadog

Create and maintain end-to-end frontend tests

Learn best practices on creating frontend tests, testing on-premise apps, integrating tests into your CI/CD pipeline, and using Datadog’s testing tunnel.

Download The Guide

Top comments (0)

The Most Contextual AI Development Assistant

Pieces.app image

Our centralized storage agent works on-device, unifying various developer tools to proactively capture and enrich useful materials, streamline collaboration, and solve complex problems through a contextual understanding of your unique workflow.

👥 Ideal for solo developers, teams, and cross-company projects

Learn more

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay