Branding and promoting Company name and logos are common business practices. You would like to see your own brand whilst signing into to Microsoft Office 365. ADFS provides opportunity for businesses to customize sign in page and promote own brand. Here are the simple steps and procedure to brand ADFS sign in page.
Remote into ADFS Server and implement below steps to customize ADFS Portal.
Change company name
Import-Module ADFS
Set-AdfsGlobalWebContent –CompanyName “Domain Corp”
Change company logo
Create a logo with 260×35 pixels @ 96 dpi with a file size of no greater than 10 KB and save the file into a path e.g. C:\Domain\logo.png. Then execute the PowerShell.
Set-AdfsWebTheme -TargetName default -Logo @{path=”c:\Domain\logo.png”}
Change Illustration
Create an illustration photo to be displayed on the left hand side of the sign in page. Photoshop illustration.png file to be 1420×1080 pixels @ 96 DPI with a file size of no greater than 200 KB.
Set-AdfsWebTheme -TargetName default -Illustration @{path=”c:\Domain\illustration.png”}
Add sign-in page description
Set-AdfsGlobalWebContent -SignInPageDescriptionText “<p>Sign-in to Domain Corp requires you comply with corporate information uses policy. Click <A href=’http://www.Domain.com/policies/’>here</A> for more information.</p>”
Add Help Desk Link
Set-AdfsGlobalWebContent -HelpDeskLink https://www.Domain.com/help/ -HelpDeskLinkText Help
Add Home Link
Set-AdfsGlobalWebContent -HomeLink https://www.Domain.com/home/ -HomeLinkText Home
Add Privacy Link
Set-AdfsGlobalWebContent -PrivacyLink https://www.Domain.com/privacy/ -PrivacyLinkText Privacy
Customize the Update Password page description
Set-AdfsGlobalWebContent -UpdatePasswordPageDescriptionText “This is the Domain Corp Update Password page.”
Customise error page
Set-AdfsGlobalWebContent -ErrorPageGenericErrorMessage “This is a generic error message. Contact Domain Corp IT Support on 123466 for assistance.”
Build Custom theme
Export current theme using below Cmdlets.
Export-AdfsWebTheme -Name default -DirectoryPath c:\Domain\Theme\Custom
Replace existing theme with Custom Theme.
New-AdfsWebTheme -Name Custom -SourceName default
Open the script file you downloaded from “C:\Domain\Theme\Custom\script\onload.js” in Notepad
Add this line at the bottom of the script to change the placeholder text in the username input box
document.forms[‘loginForm’].UserName.placeholder = ‘username@domain.com’;
Add these blue lines at the bottom of the script to add a text above the login form, this is an example from Microsoft that you can find further down
// Sample code to update the username format test “someone@example.com”.
var userNameInput = document.getElementById(Login.userNameInput);
if (userNameInput) {
// userNameInput element is present, modify its properties.
userNameInput.setAttribute(‘placeholder’, ‘Corp UserName OR EmailAddress’);
}
// Sample code to change “Sign in with organizational account” string.
// Check whether the loginMessage element is present on this page.
var loginMessage = document.getElementById(‘loginMessage’);
if (loginMessage)
{
// loginMessage element is present, modify its properties.
loginMessage.innerHTML = ‘Sign in with your company email address OR Corp UserName and password’;
}
var AppendUPN = function () {
var userName = document.getElementById(Login.userNameInput);
if ((/^\d+$/.test(userName.value)) && userName.value.length == 6)
{
userName.value = ‘Corp\\’ + userName.value;
}
return true;
}
document.getElementById(‘submitButton’).onclick = new Function(“AppendUPN();return Login.submitLoginRequest();”);
document.getElementById(‘loginForm’).onkeypress = function(event){ if(event && event.keyCode == 13) {AppendUPN();Login.submitLoginRequest()}};
When you are done and save changes. Upload the changes to the newly created theme
Set-AdfsWebTheme -TargetName Custom -AdditionalFileResource @{Uri=’/adfs/portal/script/onload.js’; path=”c:\Domain\Theme\Custom\script\onload.js”}
Now apply the changes with this command
Set-AdfsWebConfig -ActiveThemeName Custom
Use these commands to verify your settings
Get-AdfsWebConfig
Get-AdfsGlobalWebContent
