Customizing Management Portal Header
Good day,
Is there a way to change the theme in management portal? or at least the color of the header.
Issue is, some users have access to Development and Testing and Production environments. I would like a way to color-differentiate the environments to reduce the errors.
In the Management Portal go to:
System > Configuration > Memory and Startup
Change the System Mode and it will put a custom banner in the header indicating Dev / Test / Live
Thank you a lot! This is a start.
This added a caption in the header, only on Live with a red color.
Can we have the whole banner colored?
As an unsupported, inelegant, and prone to break hack!, we've amended one of the standard CSS pages for our HealthShare 2018 installation:
ZEN_Component__core_3.css
(for Windows, located in <InstallPath>\CSP\broker )
Just added a background colour as follows for our live server:
Doesn't display on every page but does on important pages for us like SQL, lookup tables, configuration pages:
.zendiv {
background: #FFE0E0;
}
Thank you! Very elegant. Will be implementing some of those.
Hey Eduard,
Actually the users have different access roles on each server. Yet, such a feature would be nice to have, especially for server administrators. We're relatively new to Ensemble, after checking your article, it would be beneficial for our case.
Thank you!
Making further changes to the SMP banner isn't supported unfortunately.
NOTE: See this new article I threw up from Global Summit content I presented a few years ago for more ideas on differentiating Testing and Production environments:
https://community.intersystems.com/post/managing-many-environments-and-protecting-production
Should they have access?
The best solution here is restricting access.
InterSystems security model allows for a customizable access management.
Application building/testing/deployment tasks could be fully automated and so not require human intervention at all.
I've cobbled together a little TamperMonkey/GreaseMonkey script that diddles with the style sheet without having to make unsupported changes to your installation's configuration. Adust the devattr, qaattr and prdattr variables to suit your color tastes, and the match arguments for the hostnames to identify your servers.
// ==UserScript==
// @name Management Console Banner
// @namespace http://tampermonkey.net/
// @version 0.2
// @description Seems to work for both Chrome and Firefox
// @author Jeff Drumm, HICG LLC
// @include *://*/csp/sys*
// @include *://*/csp/healthshare*
// @grant none
// ==/UserScript==
function addGlobalStyle(css) {
var head, style;
head = document.getElementsByTagName('head')[0];
if (!head) { return; }
style = document.createElement('style');
style.type = 'text/css';
style.innerHTML = css;
head.appendChild(style);
}
var devattr = 'color-stop(0.0,rgb(95, 246, 18)), color-stop(0.5,rgb(20, 204, 51)), color-stop(1.0,rgb(232, 227, 226))'
var qaattr = 'color-stop(0.0,rgb(248, 252, 10)), color-stop(0.5,rgb(204, 199, 20)), color-stop(1.0,rgb(232, 227, 226))'
var prdattr = 'color-stop(0.0,rgb(255, 2, 49)), color-stop(0.5,rgb(204, 18, 18)), color-stop(1.0,rgb(232, 227, 226))'
var curattr = ''
if (window.location.hostname.match('^ensprod.*')) {
curattr = prdattr;
} else if (window.location.hostname.match('^ensqa.*')) {
curattr = qaattr;
} else {
curattr = devattr;
}
addGlobalStyle('.portalTitle { background: -webkit-gradient(linear, left top, left bottom, ' + curattr + ') !important; } ');
Hi all,
I've created a browser extension that changes the header colour to make it obvious which environment you're in
It also organises the environment tabs into tab groups to keep the environments all together ('environments' referred to as 'instances' throughout my extensions docs!)
If you find it helpful, I'd really appreciate it if you voted for it in the Intersystems Grand Prix competition
* I actually came across this post when I was first trying to sort this problem for myself and it was @Jeffrey Drumm 's suggestion about TamperMonkey/GreaseMonkey that gave me the idea for a browser extension to do this, thanks Jeffrey
Thank you a lot! This is a start.
This added a caption in the header, only on Live with a red color.
Can we have the whole banner colored?
*Just realised that comment is most likely spam as is just a copy of a comment further up.
First, make sure the Custom Header Colours checkbox is ticked on the Options page
If that doesn't work then it could be the CSS file that's injected onto each page where the issue is and you could try editing the targeted classes in the red.css file