In this beginner tutorial, you'll learn how to customize the login page of your Joomla 5 site. No coding skills required, no useless extension to install, just you and the Joomla's magic :)

Howdy, Joomla fellows!

In this Joomla 5 tutorial, you'll learn how to customize the login page by:

• changing the backend logos
• customizing the login page texts
• replacing the support links
• changing the colours of the admin panel

By default, the Joomla 5 login page looks like this (I've highlighted the parts we'll customize):

Thanks to this tutorial, your Joomla 5 login page could look like this:

Who is this Joomla 5 tutorial for?

This tutorial is for any Joomla site owners who want to customize their Joomla 5 login page.

To follow this tutorial, you don't need:

• any technical skills or coding knowledges
• to install any third-party useless extension
• to hire a web designer

Are you ready? Ok, let's start!

Let's change the colours and the logos

• Open your admin panel and navigate to System > Templates > Administrator Template Styles.
• Open Atum - Default template.
• Open Colour Settings tab. Don't hesitate to "play" with the colours to adjust the colour scheme to your needs.
• Here, you can customize the link colour (#2a69b8 as default). This will change the colours of all the links in your Joomla backend.
• Click Save when you're done.

Need a FREE colour scheme generator for your Joomla site?
Lucky you, here is exactly what you're looking for: https://colours.joomla.com created by Elisa Foltyn.

• Open, the Image Settings tab.
• Add your new the Login Logo. This is the logo displayed on the middle of your login page, on the top of the lofin form.
• Add you new Brand Large logo. This is the logo displayed on the left top of your login page. Ideal size (px): 150 x 30
• Add your Brand Small logo. This is the logo displayed on the top of the admin pages on mobile mode. Ideal size (px): 20 x 20
• Click Save & Close when you're done.

Let's change the texts and the links

• Open System > Manage > Language Overrides.
• In the dropdown list, select YOUR-LANGUAGE - Administrator.
• Click the New button on the top of the page.
• Search for the text Joomla Administrator Login.
• Select the result TPL_ATUM_BACKEND_LOGIN displayed below.
• In the field text, replace the default text, by yours.
• Click Save & Close when you're done.

• Open System > Manage > Administrator Modules</.
• Search for Login Support.
• Unpublish the module Login Support and click Save & Close.
• Click the New button on the top of the page.
• Select Custom as module type to create.
• Fill the fields, and select Sidebar for the module position.
• Click Save & Close when you're done.

Go further with CSS

And of course, you can also easily improve your backend customization with some additional CSS.

• Open System > Templates > Administrator templates.
• Click on Atum Details and Files.
• Click on New file button on the top of your page.
  • Click on the CSS folder on the left.
  • Indicate user for the file name field on the right.
  • Select CSS for the file type on the right.
  • Click on the create button.

Now, you can add all the CSS classes you want in your user.css file if you want to get further on your customization work.

Conclusion

Yeah congrats, you did it!
As promised, no need to learn tech skills, to install useless extension, or to hire a web designer to customize your Joomla 5 login page. Just with some parameters, you can do a lot, and by yourself.