Changing the jenkins logo on the login screen

Viewed 193

I have a problem with replacing the jenkins logo on the login screen. Uses the jenkins login-theme add-on:

https://plugins.jenkins.io/login-theme/

In head I define the following code:

<style>

.simple-page .logo {

background-image: url('https://www.jenkins.io/images/logos/snow/snow.png');

background-repeat: no-repeat;

background-position: 50% 0;

height: 350px;

background-size: contain;

}

.simple-page form {

width: unset;

max-width: unset;

}

</style>

However, in the header like this:

<script>

document.getElementsByTagName('h1')[0].textContent = 'Welcome to Balajee\'s Jenkins!'

</script>

I get something like this:

enter image description here

The old logo is automatically added to the code all the time

</head><body><div class="simple-page" role="main"><div class="modal login"><div id="loginIntroDefault"><div class="logo"><img src="/static/9e651e0d/images/svgs/logo.svg" alt="Jenkins logo"></div><h1>Witamy w Jenkinsie!</h1></div>

How to block the appearance of the old logo and keep only the new one ???

1 Answers

I managed to solve the problem myself, more Work Around because it seems to me that the plugin responsible for changing the look of the home page is not working properly. As I wrote above, there was a problem with the fact that apart from the logo that I define, also the default logo appears. The workaround for this porble based on the generated HTML code was very easy to just resize the gernered default logo to zero with the following code:

In Head fieled :

    <style>
    .simple-page .logo {
        background-image: url('https://www.jenkins.io/images/logos/snow/snow.png');
        background-repeat: no-repeat;
        background-position: 50% 0;
        height: 200px;
        background-size: contain;
    }
   
   .simple-page .logo > img {
    height: 0;
    }

   </style>
Related