Add a logo to login page without plugin

Kirby 3 Solved ✅
1

Hi,

I was wondering if it’s possible to add a logo on top of Kirby’s login page? I found this in the documentation but it seems to require some plugin:

Is there a blueprint I can just add the logo to?

Thanks,

2

The alternative would be to add a logo via a Panel stylesheet, see panel | Kirby CMS

For example:

.k-installation-view form::before {
  content: url(http://placehold.it/350x150);
}

Or maybe inject via custom Panel JavaScript.

3

I’ve tried the following but no images are appearing.

I’ve added this in my config.php

'panel' => [
        'css' => 'assets/css/custom-panel.css'
    ],

And this in my custom-panel.css

.k-installation-view form::before {
  content: url("../assets/images/logo-black.png");
}

Is there something i’m missing?

4

The path is wrong

  content: url("../images/logo-black.png");
5

Nothing still. Just to be sure we’re talking about the same thing. I’ll attach a screenshot of where I want the logo to be displayed.

ss
ss1145×719 7.37 KB

6

Please check your browser dev tools (network tab) if the path to the logo is wrong or if you can see it in the inspector.

7

My logo is located in /assets/images/logo-black.png
I don’t see the logo anywhere in the inspector.

I’ll attach a screenshot of the inspector.

ss-1
ss-11829×850 45.5 KB

8

must be .k-login-view, so you probably need both installation view and login view

9

Yup so we got it. For those who might need it, the CSS is:

/* Add your own custom css here */
.k-login-view form::before {
  content: url('../images/logo-black.png');
}

Thanks!

1 Like