Salesforce Docs Portal

Create a Custom Login Page in Visualforce

Create your custom login page in Visualforce, and associate it with your site from the Login & Registration page of the Administration workspace. You can also create custom Visualforce pages for password, forgot password, and self-registration. You can add these login pages to your Experience Cloud site regardless of the template you used to create the site.

Required Editions

Available in: Salesforce Classic and Lightning Experience
Available in: Enterprise, Performance, Unlimited, and Developer Editions
User Permissions Needed
To create and edit Visualforce pages: Customize Application
To edit Apex classes:

Author Apex

AND

Customize Application
Note
Note You can select a Visualforce page as your custom login page for Aura sites only. If you used a Visualforce page as your custom login page for an LWR site before Summer ’23, the site can continue to use the Visualforce page. However, if you change the LWR site’s login page to another page type, you can’t go back to using the Visualforce page.
  1. Create a Visualforce page. To customize the look of your login page, create a Visualforce page. To determine how the Apex controller gets invoked, include Apex code. For example, when the user clicks the Login button:
    apex:commandButton action="{!login}" value="Sign in" id="login-submit" styleClass="btn btn-lg btn-primary btn-block"/>
  2. To make your page available externally, set up public access.
    1. From Setup, in the Quick Find box, enter All Sites, and then select All Sites.
    2. Next to your site name, click Workspaces, then click Administration.
    3. In the Administration workspace, select Pages.
    4. Click Go to Force.com.
    5. Click Public Access Settings.
    6. Under Enabled Visualforce Page Access, click Edit.
    7. Select the Visualforce pages you created, add them to Enabled Visualforce Pages, and save your changes.
      Enable Visualforce pages
    8. If necessary, enable Apex classes for public access. Under Enabled Apex Class Page Access, click Edit, select the classes, and add them to Enabled Apex Classes.
  3. From your Login & Registration page, replace the site’s default pages with your custom Visualforce pages.
    1. From Experience Workspaces, select Administration, and then select Login & Registration.
    2. Under Login Page Setup, select Visualforce Page, click lookup magnifying glass, and then select your custom Visualforce page from the list. Be sure that your site’s login page and your site’s Reset Password page use different Visualforce pages.
  4. View your custom login page from a browser in private (incognito) mode.