Skip to Content

In some cases the customer needs a personalized login based on standard Fiori logon.
This tutorial shows how to customize the standard fiori login.

This tutorial is based on https://archive.sap.com/discussions/thread/3904983

 

 

Step 1: Create SRA login class

This class contains all constants values to change images and some colors of Standard Fiori login.

 

  • Go to transaction SE24

 

  • Copy standard class: /UI2/CL_SRA_LOGIN.

Note: this class contains the method INIT_DEFAULT_PROPERTIES with all logon values. Later on I will explain how this method works.

Step 2: We assign the new custom login class to our application

  • Goes to transaction SICF and route: default_host > SAP > BC > UI5_UI5 > your_application.

 

  • Enter into the service related with your application and goes to tab “Error Pages” and then click on “Configuration”.

  • In the next screen you can add your new custom login class.

 

  • Select option “Define Service-Specific Settings” then select option “Custom Implementation”. Then in the input field “ABAP Class” add your new class (generated in step 1).

 

  • In this point you can see the standard Fiori login page:

… So now, let’s got to personalize the logon page ;).

Step 3: Modify images and logos

  • You can see all files related with logon page in transaction: SO2_MIME_REPOSITORY. In this transaction the logon is in standard route: SAP > PUBLIC > BC > UI2 > logon

Note: you can modify this files but then you lose the origianl logon files. So I recommend add a new folder in UI2 folder ( only need a left click ) and copy or add new files with your personalization.

  • After add new files with your own personalization (you can use the original files login_background_xxx.jpg as template).

 

  • It is time to modify the path of standard files and user your own files (so, we assume that we created a new folder in UI2 and we add new files in this folder).

 

  • Goes to transaction SE24 and edit your custom login class. Goes to method INIT_DEFAULT_PROPERTIES.

 

  • This method contains all parameterizations of custom login page, so we need to modify the path of new files. This path contains all images:

Step 4: Extra customizations

Sometimes is not enough to modify images. In these cases you can modify standard HTML login or css files.

  • You can copy files from SAP > PUBLIC > BC > UI2 > logon using template_css.css and template_login.html

 

  • In this case is necessary change standard path in your custom logon class:

 

To report this post you need to login first.

3 Comments

You must be Logged on to comment or reply to a post.

  1. Suhas Narasimhan

    Hi Enric,

    Thanks for the blog. I have made all the changes as per the blog, but my launchpad still seems to be picking up the properties from the original class and not my custom class. Anything that I am missing?

     

    Thanks

    Suhas

    (0) 

Leave a Reply