In the development of admin panels using Filament PHP, enhancing form button aesthetics can significantly improve the user experience. This tutorial provides guidance on modifying button icons and labels for both Create and Edit forms.
Create Form
To customise the Create form buttons, access the CreateUser.php
file located within your UserResource/Pages directory
. There, you can override the relevant functions to make your desired adjustments. By implementing these changes, you can tailor the buttons to better fit the design and functionality needs of your application.
<?php
namespace App\Filament\Resources\UserResource\Pages;
use App\Filament\Resources\UserResource;
use Filament\Resources\Pages\CreateRecord;
use Filament\Support\Enums\IconPosition;
class CreateUser extends CreateRecord
{
protected static string $resource = UserResource::class;
// Customise the "Create" button
protected function getCreateFormAction(): Action
{
return parent::getCreateFormAction()
->label('Add New User')
->icon('heroicon-o-user-plus')
->iconPosition(IconPosition::Before);
}
// Customise the "Create & Create Another" button
protected function getCreateAnotherFormAction(): Action
{
return parent::getCreateAnotherFormAction()
->label('Save & Create Another')
->icon('heroicon-o-plus-circle')
->iconPosition(IconPosition::Before);
}
// Customise the "Cancel" button
protected function getCancelFormAction(): Action
{
return parent::getCancelFormAction()
->label('Go Back')
->icon('heroicon-o-arrow-left')
->color('gray');
}
}
Edit Form
For the Edit form buttons, you'll need to modify the EditUser.php
file in your UserResource/Pages
directory:
<?php
namespace App\Filament\Resources\UserResource\Pages;
use App\Filament\Resources\UserResource;
use Filament\Resources\Pages\EditRecord;
use Filament\Support\Enums\IconPosition;
class EditUser extends EditRecord
{
protected static string $resource = UserResource::class;
// Customize the "Save" button
protected function getSaveFormAction(): Action
{
return parent::getSaveFormAction()
->label('Update User')
->icon('heroicon-o-check-circle')
->iconPosition(IconPosition::Before)
->color('success');
}
// Customize the "Cancel" button
protected function getCancelFormAction(): Action
{
return parent::getCancelFormAction()
->label('Go Back')
->icon('heroicon-o-arrow-left')
->color('gray');
}
}
Customising form buttons in Filament PHP is straightforward and can greatly improve your admin panel's usability. By overriding these methods, you can create a more intuitive and visually appealing interface for your users.
Remember to import the necessary classes and ensure your namespace matches your application's structure. The changes will take effect immediately after saving the files.
Top comments (0)