BSP/HowTo – Customizing the design of System Logon page in NetWeaver ’04
The standard Basic Authentication pop-up works fine but if you are publishing your BSP application in Internet you will need a well designed Logon Page where users can choose the language, change the password, etc… NetWeaver’04 propose a new way to do that; it is called System Logon. The BSP application System (used in SAP Web AS 6.20) with its html pages is still supported but I think that the new way is better engineered and easier to be customized.
STEP 1 – Switching on System Logon
Call transaction SICF, locate your BSP Application and perform the following steps:
- double click on your BSP application
- choose the Error Pages Tab
- In the Logon Errors Tab select the System Logon option
- Click on the Settings button
- In the new page, select the Define Service-Specific Settings option
- Now it’s important to choose on of the SAP Implementation with the preferred SAP Motiv
- Type Enter and then SAVE your work. You are ready to test the System Logon just calling your BSP application
- I think you’ll test now other SAP implementations and the behavior of each available option
- I’ll describe the User-Specific – Class in the next chapter; please wait a while…
I like so much the Check for multiple Logon option (Logon on to your application from different computers in the same time to test it).
STEP 2 – Adapting System Logon to your Visual Identity
System Logon support everything a Logon page needs. But what about the design? Everybody needs to adapt it to the company identity Ok now its time to involve an ABAP Object programmer. In NW’04 SP11, she/he should perform the following steps: Step 2.1 – create a new ABAP class Z_ICF_BASIC_LOGIN that inherits from CL_ICF_BASIC_LOGIN Step 2.2 – define a new attribute called CO_ID_DEFAULT_BUTTON Type Constant, Visibility Private ,Type STRING, value ‘sapSL_DEFAULT_BUTTON’. You can copy it from class CL_ICF_BASIC_LOGIN Step 2.3 – redefine method RENDER copying the source code from CL_ICF_BASIC_LOGIN As you can see, the last statement of the method RENDER refer to the variable lv_content_html where all the HTML staff has been previously prepared. Without being too much invasive, I suggest to insert same lines of code before the last statement in order to manipulate the lv_content_html variable. For example you can write something like:
‘ ‘ ‘ ‘ ‘ “%title% will be replaced ‘ ‘ ‘ ‘ ‘
|%title%||Insert your Logo–>’ ‘ ‘ ‘|
‘ ” MAIN AREA ” ‘ ‘ ” LEFT FRAME ‘ ‘ ” RIGHT FRAME ‘ ‘ “%html_right_frame_text% will be replaced ‘ ‘ ‘
|‘ ‘ ‘ ‘ ‘ ‘ ‘ ‘ ‘ ‘ ‘ ‘ ‘ “%sapLogonpage% will be replaced ‘ ‘ ‘
‘ INTO lv_outer_outer_html. * Insert Your TITLE DATA lv_title_html TYPE string. lv_title_html = ‘Your Title’. * lv_title_html = cl_bsp_runtime=>get_otr_text( alias = ‘ZSDN/PortalTitle’ ). REPLACE ‘%title%’ WITH lv_title_html INTO lv_outer_outer_html. * Insert Your right fram text DATA l_html_right_frame_text TYPE string. l_html_right_frame_text = ‘Your Free Text’. * l_html_right_frame_text = cl_bsp_runtime=>get_otr_text( alias = ‘ZSDN/PortalRightFrameText’ ). REPLACE ‘%html_right_frame_text%’ WITH l_html_right_frame_text INTO lv_outer_outer_html. * Insert System Logon staff REPLACE ‘%sapLogonpage%’ WITH lv_content_html INTO lv_outer_outer_html. * Move back to the std variable lv_content_html = lv_outer_outer_html. Now we are going to activate the customized class: call again transaction SICF, locate your BSP Application and in the System Logon Configuration choose User-Specific option at the right button area and type the ABAP class name just created (eg. Z_ICF_BASIC_LOGIN) SICF screen shot: That’s it! Perform a new login to your BSP application to see that your ABAP is generating the page.
Previews of the resulting page…
Some more customizations….
Title In add, I found out that the window’s Page Title can be set redefining method RENDER_PAGE (copying the source code from CL_ICF_BASIC_LOGIN) where I added also a link to my stylesheet file. Theme Unfortunately, via SICF, the theme selection is allowed only for the SAP standard implementation method. To set the preferred theme in our customer CLASS you can redefine method INIT_UR (copying the source code from CL_ICF_BASIC_LOGIN) and adjust the CASE lv_theme_root. Language I got also trouble with the language dropDownListBox where only English and German are present. I fixed it redefining method CREATE_LOGIN_FORM (copying the source code from CL_ICF_BASIC_LOGIN) and adding some lines of code before the statement “if lines( m_languages ) > 0.”