Editing the source HTML of your login screen
Make your login screens immediately recognizable and promote your brand by customizing the login screens of your application. For example, you can edit the source HTML of the login screen to display your own logo or custom text.
- HTML rule for the login screen for an unauthenticated user session. The rule is used by the /prWeb/ servlet and prompts users for the login ID and password.
- HTML rule for the LDAP login screen for an unauthenticated user session. Prompts users for the LDAP login ID and passwords.
- HTML rule for an authentication screen for an unauthenticated user session. The rule is used by the /PRAuth/ servlet and requests an identity provider (IDP) for single sign-on. If users select a third-party IDP on this screen, the system redirects users to an IDP login screen that is not managed by Pega. Prompts users for the login ID, password, and single sign-on credentials.
- HTML rule for the Forgot Password screen for an unauthenticated user session.
In the header of Dev Studio, in the Search field, search for the name of the HTML login rule that you want to edit.
In the Generate For list, choose the screen type:
- If your customized login screen uses HTML directives, select HTML.
- If your customized login screen uses JavaServer screen tags, select JSP.
In the Browser Support list, choose which browsers can use your screen:
- If all modern browsers support your customized login screen, select Modern browsers.
- If only Microsoft Internet Explorer supports your customized login screen, select IE only.
In the Accessibility list, tag whether your customized login screens meet the accessibility requirements for your application.For more information about accessibility compliance reports, see Using the Accessibility report.
In the HTML source field, enter your customized login screen HTML.In the source HTML of the Web-Login rule, find the code fragment that defines the logo source:
<img src= 'webwb/pzpega-logo.svg' class="logo" alt="Pega Logo" />
Replace the existing value with the new image source in the following format:
<img src= 'webwb/New Logo File Name' class="logo" alt="Pega Logo" />
If your customized login references clipboard pages, click the Pages and Classes tab, and then enter the required clipboard pages and the classes to which they belong.
Click Save.The customized HTML of your login screen is built into your application instance.
Save the changes by clicking Check-in.
To verify how the login screen reflects your customized HTML, in the Actions list, select Preview.
ArticleCreating binary file rules