Widgets

Resources

Getting started

Filament allows you to display widgets inside pages, below the header and above the footer.

You can use an existing dashboard widget, or create one specifically for the resource.

Creating a resource widget

To get started building a resource widget:

php artisan make:filament-widget CustomerOverview --resource=CustomerResource

This command will create two files - a widget class in the app/Filament/Resources/CustomerResource/Widgets directory, and a view in the resources/views/filament/resources/customer-resource/widgets directory.

You must register the new widget in your resource's getWidgets() method:

public static function getWidgets(): array
{
return [
Widgets\CustomerOverview::class,
];
}

Displaying a widget on a resource page

To display a widget on a resource page, use the getHeaderWidgets() or getFooterWidgets() methods for that page:

<?php
 
namespace App\Filament\Resources\CustomerResource\Pages;
 
use App\Filament\Resources\CustomerResource;
 
class ListCustomers extends ListRecords
{
public static string $resource = CustomerResource::class;
 
protected function getHeaderWidgets(): array
{
return [
CustomerResource\Widgets\CustomerOverview::class,
];
}
}

getHeaderWidgets() returns an array of widgets to display above the page content, whereas getFooterWidgets() are displayed below.

Accessing the current record

If you're using a widget on an Edit or View page, you may access the current record by defining a $record property on the widget class:

use Illuminate\Database\Eloquent\Model;
 
public ?Model $record = null;

Still need help? Join our Discord community or open a GitHub discussion

Enjoying Filament?

We are open source at heart. To allow us to build new features, fix bugs, and run the community, we require your financial support.

Sponsor Filament on GitHub