Editing CSS for Top Frame only

[medfordite]

I have two installations of WHM and one of the DNS Only for my hosting environment. I sometimes need to go into the WHM or DNS to make changes, or whatnot. I would like to be able to edit the CSS for the top frame only above the logo so when I switch to the tab, I can know based on the color of which server I am in (Yes I know it says in the line, but a quick color glance works better for me).

In the example below, it would be the line above the "BOW" logo:

/http://s178.photobucket.com/user/itsme5379/media/example.png.html

I have cloned the original theme to work on this. I am using Firebug and have located the

.informationWrapper {

portion of the CSS but am not able to locate which file it is in so I can manipulate the color of the bar.

And to answer any questions - I know that the word BOW is good enough for visual identification, but also the top bar is where my eyes are drawn to first when changing tabs. (center of it) as below:

/http://s178.photobucket.com/user/itsme5379/media/capture2.png.html

This is only a local browser edit and not the file edit so any changes will be lost upon reload.

 

[cPanelMichael]

Hello

We do not currently support custom theme or localization efforts for WHM. I was not able to find any documentation on the specific aspect of the WHM theme you are attempting to modify, but I do see that the template files are located in:

/usr/local/cpanel/whostmgr/docroot/templates

I will leave this thread open for others to add their input.

Thank you.

 

[kdean]

You may want to find a Firefox Add-on that allows you to modify the css styles of a site in your browser only. I use a similar extension in Safari. Then it would just apply your css modifications on top of the existing styles whenever you go to the site allowing you to make it look different. I'm not as familiar with Firefox Add-ons or I'd point you to one, but I'm sure they exist.

 

[MikeLewin]

In case anyone else is still Googling for this as I was.

Firstly, I think WHM should make this a bit more obvious for those of us who do manage more than one installation.. Having different color schemes helps differentiate and avoid mistakes

Anyway -

The CSS files to change are here

Top frame - /usr/local/cpanel/whostmgr/docroot/templates/menu/top_frame.min.css
2 bar styles are - .informationWrapper (top) and .navigationContainer (2nd, where logo, etc is)

Left (menu) frame - /usr/local/cpanel/whostmgr/docroot/templates/menu/command.min.css
There are several styles that affect the left frame -
I just searched for background: and background-color: references - made changes, saved and hit refresh in WHM

Content (right) frame - /usr/local/cpanel/whostmgr/docroot/templates_menu/unified_optimized.css
I just added body {background-color:#efe;} before the first entry (.grid-container) after the copyright stuff

Hope that helps someone..

Mike