|  Login
 Changing the Header Background Color
Minimize

Overview

The default appearance of the portal is the DNN-Blue skin.

Suppose you want to change the background color of the header at the top of the page from light blue to white so that your logo file with a white background looks better.

headerbg43.gif




It would SEEM like the logical way to do that would be to edit the CSS file that is found near the bottom of the Admin page.

Well, that doesn't work.    The short, non-techical explanation for that is that there are several css files in the DNN portal, and the one that the admin page edits is trumped by one named skins.css that is found in root/Portals/_default/Skins/DNN-Blue/.  

You have to MANUALLY change that skins.css file if you want a white header on the default DNN-Blue skin. (like on this page)   To do that , you have to fpt the file down, make a change to the .skinheader  item, and upload it again to the folder.


 

1.   Using your ftp program (I'm using WSftp here), locate the skins.css file in root/Portals/_default/Skins/DNN-Blue of your DNN portal.

headerbg44.gif





2.  Download the skins.css file.

headerbg46.gif





3.   Open the file with Notepad (or some other text editor or css editor).  The default version  of the skins.css file in the DNN-Blue folder does not have an entry for  skinheader.

headerbg45.gif





4.  Change the  skinheader entry to reflect the desired background color or background image you want to use.  (Do a search for css syntax is you don't know how to make the changes.)  The highlighted line below will change the background of the header to white.

headerbg48.gif





5.  Save the file, then upload the altered file to the same DNN-Blue folder.  Close the ftop program. 

headerbg49.gif





6.  Refresh the portal page to enact the changes.

headerbg50.gif 





This will change the header background on all pages that use the DNN-Blue skin.