How to keep app global footer stuck at the bottom

Hello. I have a footer for my application with the copyright. I did it with a RenderHook like this:

            ->renderHook(
                'panels::footer',
                fn(): View => view('filament.settings.custom-footer'),
            )

            ->renderHook(
                'panels::footer',
                fn(): View => view('filament.settings.custom-footer'),
            )

And it is working fine, but I would like to know how to make it sticky to the bottom. Now it appears when the content of the page ends, so it is in a different position every time. I have tried to use CSS, but I don't know what class I have to manipulate. Any ideas, please?

Solution:

https://github.com/filamentphp/filament/pull/10996

GitHub

RenderHook constants by margarizaldi · Pull Request #10996 · filame...

Description Memorization is just a pain. Code style composer cs command has been run. Testing Changes have been tested. Documentation Documentation is up-to-date.

Jump to solution

10 Replies

Thijmen•4mo ago

->renderHook(
   PanelsRenderHook::FOOTER,

->renderHook(
   PanelsRenderHook::FOOTER,

Is working fine for me What does your view look like?

Albert Lens•4mo ago

My view is:

<div class="myFooter">
    <p class="text-center text-sm text-gray-600">
        <a href="https://robustdatasolutions.com" target="_blank" class="text-gray-600 hover:text-gray-900">Robust Data Solutions</a> &copy; {{ date('Y') }}. Todos los derechos reservados.
    </p>
</div>

<div class="myFooter">
    <p class="text-center text-sm text-gray-600">
        <a href="https://robustdatasolutions.com" target="_blank" class="text-gray-600 hover:text-gray-900">Robust Data Solutions</a> &copy; {{ date('Y') }}. Todos los derechos reservados.
    </p>
</div>

A very simple div with a p and some text. Just that.

Thijmen•4mo ago

Can't you just target the myFooter and align it at bottom?

Albert Lens•4mo ago

I have tried, but not working.

myFooter {
    position: absolute!important;
    bottom: 0!important;
    width: 100%!important;
    height: 40px;
  }

myFooter {
    position: absolute!important;
    bottom: 0!important;
    width: 100%!important;
    height: 40px;
  }

That is my class in CSS And have used: php artisan filament:assets Using your advised RenderHook like this is not working for me. Now I see nothing of the copyright footer:

            ->renderHook(
                'PanelsRenderHook::FOOTER',
                fn(): View => view('filament.settings.custom-footer'),
            )

            ->renderHook(
                'PanelsRenderHook::FOOTER',
                fn(): View => view('filament.settings.custom-footer'),
            )

At least with my previous one I saw it:

            ->renderHook(
                'panels::footer',
                fn(): View => view('filament.settings.custom-footer'),
            )

            ->renderHook(
                'panels::footer',
                fn(): View => view('filament.settings.custom-footer'),
            )

Thijmen•4mo ago

What is your filament version My renderhook is from a recent version where the renderhook names were changed

Albert Lens•4mo ago

v3 maybe I have to update filament also I have updated everything. And nothing is seen using 'PanelsRenderHook::FOOTER' 😫

Thijmen•4mo ago

https://filamentphp.com/docs/3.x/support/render-hooks#available-render-hooks

Render hooks - Core Concepts - Filament

Solution

Thijmen•4mo ago

https://github.com/filamentphp/filament/pull/10996

GitHub

RenderHook constants by margarizaldi · Pull Request #10996 · filame...

Description Memorization is just a pain. Code style composer cs command has been run. Testing Changes have been tested. Documentation Documentation is up-to-date.

Thijmen•4mo ago

Was released in 3.2.23

Albert Lens•4mo ago

Thank you, friend. I was using 3.2.0 but I did not realize that in my composer.json I had "filament/filament": "3.2". I have changed to "filament/filament": "^3.2", ran composer update and now it is working fine. Tks a lot.

Gaming

Programming

How to keep app global footer stuck at the bottom