
Add a Language Switcher Under The User Menu
- Published: 22 Apr 2024 Updated: 04 May 2024
Integrate Language Switcher in User Menu for a Cleaner Top Bar

Register a Render Hook:
Begin by registering a new render hook to your panel provider. We'll place the switcher in the USER_MENU_PROFILE_AFTER
position to keep the top bar clean, but you can register it any position you want.
1->renderHook(
2 PanelsRenderHook::USER_MENU_PROFILE_AFTER,
3 fn (): View => view('filament.hooks.lang-switcher'),
4)
Use the Dropdown Component
We will use the the dropdown component from Filament to render the sub-navigation for the language switcher. Customize the UI as needed, such as adding flags for different languages.
in your filament.hooks.lang-switcher
file:
1<div>
2 <x-filament::dropdown
3 maxHeight="250px"
4 placement="left-start"
5 teleport="true"
6 >
7 <x-slot name="trigger">
8 <div class="p-2 flex items-center justify-start gap-2">
9 <x-filament::icon
10 icon="heroicon-c-chevron-left"
11 class="mx-1 h-5 w-5 text-gray-500 dark:text-gray-400"
12 />
13 Select Language
14 </div>
15 </x-slot>
16
17 <x-filament::dropdown.header
18 class="font-semibold"
19 color="gray"
20 icon="heroicon-c--language"
21 >
22 Select Language
23 </x-filament::dropdown.header>
24
25 <x-filament::dropdown.list>
26 <x-filament::dropdown.list.item
27 :color="(app()->getLocale() === 'en') ? 'primary' : null"
28 icon="heroicon-m-chevron-right"
29 :href="url('lang/en')"
30 tag="a"
31 >
32 English
33 </x-filament::dropdown.list.item>
34
35 <x-filament::dropdown.list.item
36 :color="(app()->getLocale() === 'es') ? 'primary' : null"
37 icon="heroicon-m-chevron-right"
38 :href="url('lang/es')"
39 tag="a"
40 >
41 Español
42 </x-filament::dropdown.list.item>
43 </x-filament::dropdown.list>
44 </x-filament::dropdown>
45</div>
Implement the Switcher
Create a simple route to capture the selected language and store it in the session:
1Route::get('lang/{lang}', function ($lang) {
2 session()->put('current_lang', $lang);
3
4 return redirect(url()->previousPath());
5});
Set Up a Middleware
Define a middleware to instruct Laravel to pick the locale from the session:
1class SetLang
2{
3 public function handle(Request $request, Closure $next): Response
4 {
5 return app(StartSession::class)
6 ->handle($request, function ($request) use ($next) {
7 if (! session()->has('current_lang')) {
8 session()->put('current_lang', 'en');
9 }
10
11 app()->setLocale(session('current_lang', 'en'));
12
13 return $next($request);
14 });
15 }
16}
Register the Middleware
Finally, register the middleware within the Filament panel provider:
1->middleware([
2 //...
3 SetLang::class,
4])

Related Tricks:
you can disable breadcrumbs inside a resource class
Let Users to Select All Options with a Simple Hint Action
This time-saving starter kit provides a Laravel project with FilamentPHP already installed and configured, so you can dive straight into building without any of the initial setup headaches.
How to Apply Authorization on Create Option Action for Select Field