2

how can i modify the login html? I specifically want to add an image below the title.


enter image description here

2 Answers 2

5

You can add a logo to the login page by uploading one to Settings → General Login Page Logo.

If you need further tweaking, you could use the Control Panel CSS plugin.

I wouldn't recommend modifying Craft's templates.

4

I solved this by adding a module that is supposed to act as a sitemodule with different functions I use over most of my projects.

Inside that module you register an asset bundle that ultimately adds a CSS stylesheet to the controlpanel.

This way you can alter the look of the loginpage without tampering with any of Crafts innards. As can be seen from the screenshot, I have hidden the title and added another background image.

Update: To get started, head over to pluginfactory.io and enter the required fields. E.g. name it Simple Site Module. You don't need to select any of the lightswitches if you don't know what they do. Then hit "Build my module" and it will download an example module. You put that folder into "modules" inside your Craft 3 project. Then you add the contents from config/app.php(inside the new module folder) into your projects config/app.php.

Now with that module enabled (hit reload in your project to ensure you dont have any errors) you can put your custom css styles into assetbundles/simplesitemodule/dist/css/SimpleSiteModule.css.

Here is a gist with what could be in that CSS file.

example login page modified with custom css via a Craft CMS (Yii) module

2
  • This answer would be significantly more helpful if you shared the code. Commented Aug 17, 2022 at 8:08
  • 1
    I have updated my answer @InanisAtheos. I don't think I should post the entire code of a module here, but with that information you are good to go and experiment. You can find the background image I used at this location in your project: /vendor/craftcms/cms/src/web/assets/installer/src/images/installer-bg.png
    – MisterMike
    Commented Aug 26, 2022 at 12:16

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.