Starting with version 9, Veeam allows service providers to offer true Disaster Recovery as a Service (DRaaS) to their customers for both VMware vSphere and Microsoft Hyper-V, thanks to Veeam Cloud Connect Replication — a fast, secure and cloud-based disaster recovery (DR) solution.
Tenants subscribed to a service provider’s Veeam Cloud Connect Replication offering can get an access to cloud hosts provided by the service provider and create off-site virtual machine (VM) replicas. In case of a disaster at the production site, tenants can quickly and easily switch to VM replicas in the cloud and use the service provider’s infrastructure as a remote DR site.
To guarantee that tenants have easy access to their cloud failover plans, service providers can deploy Veeam Cloud Connect Portal — a convenient web tool for performing full-site failover. With Veeam Cloud Connect Portal, tenants can run cloud failover plans to switch to VM replicas in the cloud DR site in an easy and secure way.
Branding? Why do you need it?
By default, Veeam Cloud Connect Portal looks like this:
Since many tenants will see the Veeam Cloud Connect Portal on a regular basis, it represents a critical component of a service provider’s branding strategy. It communicates who the service provider is and what they offer through its organization and appearance.
Service providers can give Veeam Cloud Connect Portal that familiar look and feel by using the company’s color scheme and name. This is very easy to achieve, because Veeam provides both simple and quick options to brand the Veeam Cloud Connect Portal.
Company name
A company’s name plays a crucial role not only in a brand’s growth, but also in customers’ perceptions of it. This makes the company’s name the first impression the company, its products and services have on many people.
Most of the information one can see in Veeam Cloud Connect Portal is editable via app.js file, and the company name is no exception.
In order to replace Veeam© with the name of your company, you should find the following files (login and application pages in accordance):
[PortalDir]Scripts\build\production\LoginApp\app.js
[PortalDir]Scripts\build\production\veeamCloud\app.js
Locate the string including Veeam©:
componentCls:"app-header-title",bind:{html:'<div class="sup">Veeam <sup>®</sup></div>
Replace it with the appropriate name (Wonderland Corp. in this example):
componentCls:"app-header-title",bind:{html:'<div class="sup">Wonderland Corp.<sup>®</sup></div>
You’d see something similar to the following:
The only missing part is the portal name. That is also configurable via text editor.
This time, we’re going to replace the line containing the application name:
appName: " Cloud Connect Portal "
Enter your new application name:
appName: " Awesome Portal "
The outcome looks good, but the application title still preserves its previous name:
So, we have to open web config file:
[PortalDir]\Web.Config
Change the title name:
<add key="AppName" value="Awesome Portal"/>
Now, everything is set up how we want, so it’s time for us to proceed with color scheme customization.
Color
Branding and color go hand in hand because color provides a direct method for communicating meaning and messages without words.
The Veeam Cloud Connect Portal color scheme is present in three CSS files:
[PortalDir]Scripts\build\production\LoginApp\resources\LoginApp-all.css
[PortalDir]Scripts\build\production\VeeamCloud\resources\VeeamCloud-all_01.css
[PortalDir]Scripts\build\production\VeeamCloud\resources\VeeamCloud-all_02.css
By default, Veeam uses green (#54b948). So, you need to replace it across the mentioned documents (Edit->Replace->Replace All, if Notepad is used) with a hex code for the color you want.
For instance, the following example uses blue (#4c05ff):
Conclusion
As mentioned above, most of information regarding styles, names and colors of Veeam Cloud Connect Portal are present inside the js or css files.
Having a basic understanding of JavaScript and CSS should help you to modify it even further.
Feel free to trick it out and share your experience either here or in the corresponding section of our community forums.
This might also be interesting to you:
If you’re looking to use Veeam in your hosting environment or to provide Veeam-powered BDR services, the first step is to join the VCSP program.
Or learn more awesome ways about using Veeam Cloud Connect: Using Cloud Connect in 3 Unexpected, Awesome Ways