How to customize the look and feel of the backend login widget or the backend login page when using the new Default authentication in Sitefinity 14 and above?
Customization to backend login page lost after upgrade to 14 and switching to default authentication.
Custom login page for external authentication providers in Sitefinity 14.4
Is it possible to customize the backend login screen to load an additional user control (or redirect to a different page)

I. To customize the backend login widget

To modify the markup or add JavaScript code:

1. Download one of the attached LoginWidgetCustom.ascx files depending on the Sitefinity version. This is the default template.
1. Place the file somewhere on the file system of the project (Ex. on the root)
2. Navigate to Administration -> Settings -> Advanced -> Controls -> ViewMap
3. Click Create new
4. Enter the following information

HostType: Telerik.Sitefinity.Web.UI.PublicControls.LoginWidget, Telerik.Sitefinity
LayoutTemplatePath: ~/LoginWidgetCustom.ascx

Note: Adjust the path if the file was not placed on the root of the site

5. Restart the site
 

To modify the code-behind logic

1. Create a class that inherits Telerik.Sitefinity.Web.UI.PublicControls.LoginWidget

using Telerik.Sitefinity.Web.UI.PublicControls;

namespace SitefinityWebApp
{
    public class LoginWidgetCustom : LoginWidget
    {
         // Override methods and write custom logic here
    }
}

2. Build the project
3. Use the attached RegisterCustomBackendLoginWidget.aspx web form to change the login widget on the backend page

To modify the built-in JavaScript

1. Follow the "To modify the code-behind logic" section above
2. Override the GetScriptReferences method and load a custom JavaScript file

public override IEnumerable<ScriptReference> GetScriptReferences()
{
    var baseRefs = base.GetScriptReferences().ToList();

    baseRefs.Add(new ScriptReference("~/LoginWidgetCustom.js"));

    return baseRefs;
}

3. In the custom JavaScript file extend the built-in class and modify the necessary functions

Type.registerNamespace("SitefinityWebApp");

SitefinityWebApp.LoginWidgetCustom = function (element) {
    SitefinityWebApp.LoginWidgetCustom.initializeBase(this, [element]);

    this._customPropertyFromServer = null;
}

SitefinityWebApp.LoginWidgetCustom.prototype = {
    initialize: function () {
        SitefinityWebApp.LoginWidgetCustom.callBaseMethod(this, 'initialize');
    },

    dispose: function () {
        SitefinityWebApp.LoginWidgetCustom.callBaseMethod(this, 'dispose');
    },

    _showErrorMessage: function (message) {
        // Default function overridden
        this.get_errorMessageLabel().innerHTML = message;
        this.get_errorMessageLabel().style.display = "";
    },

    get_customPropertyFromServer: function () {
        return this._customPropertyFromServer;
    },
    set_customPropertyFromServer: function (value) {
        this._customPropertyFromServer = value;
    }
}

SitefinityWebApp.LoginWidgetCustom.registerClass('SitefinityWebApp.LoginWidgetCustom', Telerik.Sitefinity.Web.UI.PublicControls.LoginWidget);

if (typeof (Sys) !== 'undefined') Sys.Application.notifyScriptLoaded();

4. To pass a custom property from the server to the JavaScript code override the GetScriptDescriptors method

public override IEnumerable<ScriptDescriptor> GetScriptDescriptors()
{
    var baseDescriptor = base.GetScriptDescriptors().FirstOrDefault() as ScriptControlDescriptor;

    baseDescriptor.Type = typeof(LoginWidgetCustom).FullName;
    baseDescriptor.AddProperty("customPropertyFromServer", "SomeValue");

    return new ScriptDescriptor[] { baseDescriptor };
}

5. Build the project and clear browser cache for changes to take effect


II. To customize the backend login page

Go to Administration -> Backend Pages and edit the Sitefinity -> Authentication -> Login page: