Filament Tutorials

Having a search is great, but knowing what people search for - is key. So let's build a system where we can log all searches.

Sometimes, we have to show our Users what the result will look like. For example, if you enter the price in cents - we can instantly display what the amount equals by using prefix/suffix on the field.

To create a new record in Filament Resource, users typically go to the List page and click the "Add New" button. But what if you want to add that link to the sidebar navigation?

Filament has a white top bar, which might not match your design style. Let's change it to match the content colors.

The Filament has 84 Render Hooks in various places. That's why we prepared a simple Cheat Sheet to display where you can expect them to appear.

In complex tables, we often have a lot of filters. But losing them each time we click the edit/create buttons - is annoying! So, let's solve that with persistent filters.

Your application's everyday actions should be accessible as quickly as possible. So, using the Render Hooks and Livewire component, let's move them above our sidebar.

We are used to our tables having an order. Often, it's done by ID or any other column. But did you know that you can shuffle them with a single button click?

Some elements in your panel require an existing Tailwind CSS class, but often, it's not pre-compiled and doesn't work. So let's see how we can use any class!

Having a form with too much information can hurt the user experience. To solve this, we can put our Relation Managers into tabs on the edit page.