All Collections
Account Settings
Custom Branding Settings
Custom Branding Settings

The Custom Branding settings allow you to "whitelabel" the system access points for your customers.

Support Team avatar
Written by Support Team
Updated over a week ago

Please note that the Custom Branding feature is only available for Marketing PRO and Email API PRO plans.

This way, your customers will only ever see your brand. The access points are account creation, login, and SMTP/API access.

Login

There are two ways to provide custom branded browser-based access points. The first way uses a CNAME record to whitelabel the URL of the login screen and allows you to set your own logo. This video shows you how.

Hosting

The second way to offer access via the browser is by rendering the entire User Interface on your own website. If you have a hosted domain with a website, using a few lines of Javascript and HTML, you can easily render the UI on your own /account page.
This video shows you how.

The obvious benefit to this approach is that you can easily build your own menu and footer around the container div.

Please make sure that the HTML file must be saved in UTF-8 encoding.


Here are the scripts used in the video:


<!DOCTYPE html>
<html lang="en">
<head>
    <title>User Interface</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
    <script src="https://code.jquery.com/jquery-3.2.1.js" integrity="sha256-DZAnKJ/6XZ9si04Hgrsxu/8s717jcIzLy3oi35EouyE=" crossorigin="anonymous"></script>
    <script src="https://code.jquery.com/jquery-migrate-3.0.0.min.js" integrity="sha256-JklDYODbg0X+8sPiKkcFURb5z7RvlNMIaE3RA2z97vw=" crossorigin="anonymous"></script>
    <link rel="shortcut icon" href="data:image/x-icon;," type="image/x-icon" />
    <link href='https://fonts.googleapis.com/css?family=Open+Sans:400,400italic,700,600italic,600&subset=latin,latin-ext' rel='stylesheet' type='text/css' />
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.js"></script>
    <!--<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" type="text/css" />-->
    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.1/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">
    <!--<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/intro.js/2.5.0/introjs.min.css" type="text/css" />-->
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script src="https://d16keoxacgvopf.cloudfront.net/1.0/emailinterface.js" type="text/javascript"></script>
    <link href="https://d16keoxacgvopf.cloudfront.net/1.0/emailinterface.css" rel="stylesheet" type="text/css" />
</head>
<body>    
    <div id="mycontainer"></div>

    <!-- Javascript To Render UI -->
    <script type="text/javascript">
        ee.init("mycontainer", true,{
            logourl: "https://print-stock.co.uk/img/library/l/Logo_SQ.jpg"
        });
        ee.api.path = "https://api.elasticemail.com";
    </script>
</body>
</html>

Account Creation

Your customer's accounts are also known as "subaccounts". And there are two ways to create subaccounts.
In your main account, go to your Sub Accounts screen and manually create a sub-account.

This guide goes into more detail on subaccounts and how to create and manage them from within the UI.

The second method for creating subaccounts is by using the "create subaccount" API call /account/addsubaccount

This method is more advanced and will require a custom integration on your own website. However, it will allow you to automate the account creation process for your customers.

SMTP/API

Whitelabeling the SMTP/API access points is fairly easy. Just create two new CNAME records in your domain's DNS. We recommend using the 'SMTP' and 'smtp25' and point them at smtp.elasticemail.com and smtp25.elasticemail.com respectively.
This video will show you how.

Additionally, there are a couple of ways for customers to be redirected back to your website once they have access and are logged in. If your website offers a payment gateway or supports portal, then you can white-label certain links within the UI.

Custom Bounce Domain

It's possible to set a custom bounce domain for your custom branded sub accounts. If they do not use their own envelope from address, the domain that you set for them here will be used instead.

If you do not set it, you may see bounces.elasticemail.net as the Envelope From header.

This also can be done in the Sub Accounts>Manage>Custom Branding screen:
https://elasticemail.com/account/#/account/subaccounts

In order for this domain to work properly, a CNAME record will have to be set that will resolve to your domain:

Type: CNAME
Host/Name: bounces(or bounces.yourdomain.com)
Value: bounces.elasticemail.net

Single sign-on

Thanks to SSO (Single sign-on) you can log in using your favorite Service Provider with just a single click. It allows you to securely authenticate with multiple websites or applications with just one set of credentials.

Elastic Email uses OpenID solution to utilize SSO. You can learn more about SSO implemented on our platform here.

Client ID

The ID token that will be used as your single sign-on authentication method. Any character string can be used.

Authority

The URL of the OIDC/OAuth2 provider. The authority URL setting is used to make HTTP requests and discover more information about the OIDC/OAuth2 provider.

Please note that HTTPS protocol is required for the URL to be authenticated properly.

This set of credentials will allow establishing credible and secure connection between the end user (you) and a website or application of your preference used to log in.

Did this answer your question?