Add Dynamic Branding to Custom Pages

For custom pages used to log in, verify identity, reset passwords, and self-register, you can implement dynamic URLs with a custom login Apex controller. Use the Apex methods getExperienceId and setExperienceId of the System.Site class to retrieve and store the expid value.

The brand that appears at run time depends on the expid dynamic URL that you specify on the Apex page. For example, the dynamic URL, https://www.my-cms.com/{expid}/logo.png, displays the Fix Coffee brand when the login URL is https://fix.my.site.com/?expid=coffee. In this example, the background image of the login page depends on the value of expid.

<apex:page docType=“html-5.0” controller=“CustomLoginController” showHeader=“false” sidebar=“false”
<style>
    body {
        background-image: url(“https://www.my-cms.com/{!ExpID}/promo.jpg}”);
        width: 500px;
        clear: both;
        margin: 40 px 50px;
        vertical-align: middle;
    }
    h2 { color:#5F9EA0; }
</style>

In your custom login controller, include code to extract the expid value from the query parameter.

Global CustomLoginController()
{ 
        ...
 Expid = getExpidFromURL();

//Get the expid parameter from query string
Public string getExpidFromURL()
{
    String expid = '';
    expid = ApexPages.currentPage().getParmeters().get('expid');
    Return expid;
}
        ...
}

In your custom login controller, also include the setExperienceId method of the System.Site class to store the expid value in the user’s browser. When stored, you can retrieve it at any time during the lifetime of the user’s session.

Global CustomLoginController()
{ 
        ...
 Expid = getExpidFromURL();
 site.SetExperienceId(expId);
        ...
}