Koha Staff Login Page Design

We can customize our  Koha staff login page with the (library's) institute's name and logo. This will also make the login page look beautiful and will also give a sense of branding. Let's see how we can put the name and logo on the login page.

Create an image for the logo or copy it from the institute's website. Save it in the home folder with the name 'logo.jpg'

Open the terminal and run the following command to paste the logo image in htdocs folder from the home folder

sudo cp logo.jpg /usr/share/koha/opac/htdocs

Now Open koha Staff Interface

koha administration➞ Global System Preferences➞Staff Client➞StaffLoginInstructions

Add the following html scripts in the StaffLoginInstructions

<center>

<img src="http://127.0.1.1/logo.jpg" style="width:50%; height:50%;">

</center>

<p style="text-align: center;">

    <font color="#b8312f"><span style="font-size: 20px;"><b><strong><span style="text-shadow: rgba(135, 135, 135, 0.7) 3px 3px 4px;">UGIE CRNTRAL LIBRARY</span></strong></b></span></font>

</p>

<p style="text-align: center;"><span style="color: rgb(184, 49, 47);"><span style="font-size: 16px;"><strong>Library Management Software</strong></span></span></p>

Change the IP:- http://127.0.1.1 with  your Koha OPAC IP 

and UGIE CRNTRAL LIBRARY with your Institute or library

͍͍͍͍

If you want to Remove 'Koha Logo'  and put yours only. From the following way, you can replace the default 'Koha Logo' with your own.

Create a small logo and put it into a home folder and rename the logo 'koha-logo' with .gif extension (e.g. koha-logo.gif)

Open the terminal and run the following command. It will replace the default Koha logo with yours.

sudo mv /home/koha/koha-logo.gif/ usr/share/koha/intranet/htdocs/intranet-tmpc/prog/img

Now put the following html lines in the StaffLoginInstructions

koha administration➞ Global System Preferences➞Staff Client➞StaffLoginInstructions

Add the following html scripts in the StaffLoginInstructions

<p style="text-align: center;">

    <font color="#b8312f"><span style="font-size: 20px;"><b><strong><span style="text-shadow: rgba(135, 135, 135, 0.7) 3px 3px 4px;">Institute 's Name</span></strong></b></span></font>

</p>

<p style="text-align: center;"><span style="color: rgb(184, 49, 47);"><span style="font-size: 16px;"><strong>WELCOME</strong></span></span></p>

NB: In this method, your logo may change with the default koha logo while koha update