Text Version of the Lesson
For now, in this course, we've been generating Filament Resources with menu items being auto-generated for us. They have the same icon and a pretty random order. In this lesson, let's learn how to customize it all.
Menu: Left or Top?
So, for now, we have this view in the left menu:
First quick change: did you know we can easily change the menu from the left to the top? It's configurable by adding topNavigation() in the main AdminPanelProvider:
app/Providers/Filament/AdminPanelProvider.php:
public function panel(Panel $panel): Panel{ return $panel ->default() ->id('admin') ->path('admin') ->login() ->registration() ->topNavigation() With this simple change, the menu looks like this:
Ordering Menu Items
Next, if you don't specify any order for menu items, they are ordered alphabetically.
To change that, add an integer property $navigationSort in each Filament Resource, representing their order position.
For example, I want to sort the menu items in the order they would be used: from the most often (Orders) to the...
When I want to have an app suitable for multiple languages, it's common to use the __ function
__('Hello World!')However since the $navigationString variables are static, I can't assign a value as a result of a function.
Is there any way to create menu groups with 'translatable' group strings?
If you have a static variable - the is most likely a
getXXXXLabelfunction available. For example on resources, to get navigation name:Inside you can return the string that will be used as the label
Is it possible to conditionally hide a navigation badge? I have a nav item called 'settings' that I want a new user to configure first. It would be great to add a badge to this nav item to indicate that they need to do this first, if they haven't completed the form yet. After the form is submitted, the badge goes away.
Add contidion in the same
getNavigationBadge()method.How can I customize the theme of the sidebar menu?
By creating a custom theme
Hello Povilas,
First of all, I want to congratulate you on the excellent course! I'm really enjoying the content and the way you present the concepts. Your clear teaching style and practical examples have been incredibly helpful for my learning.
I have a question regarding the implementation of a menu item to log out/exit the system. Could you guide me on how to do this in the most appropriate way?
Thank you once again for the course and for your dedication to teaching us!
Is it possible to have a Top navigation that displays a secondary navigation along the side that differs for each TOP selection?
Like if each top navigation represented a different department such as HR, legal, marketing. etc where the side options would differ for each.
You can definitely do that using render hooks:
https://filamentexamples.com/tutorial/render-hooks-cheat-sheet