Customize WebReports Login Screen

Have you ever wanted to customize the WebReports login screen, but not sure how.  This article will describe the process of changing the main logo and adding special text to the center Login form. 

customize 1

We’ll first be navigating to the ../BigFix Enterprise/BES Server/BESReportsData/Templates/Login directory. 

customize 2

 

LOGO

We’re going to edit the login.body.html file and add a few pieces of code starting at 30.  We’ll be replacing the current logo div tag, so feel free to remove that.

<style>
.LOGO
{
    top:0px;
    left:0px;
    height:112px;
    width:112px;

              cursor:pointer;
              background: url(http://bigfix.me/content/smalllogo2.png) no-repeat center 3px;
                            
              display:block;
              position:fixed;
                        
              z-order:999999;    
          }
          </style>
          <div onclick="location.href='/';" id="btnLogo" class="LOGO"></div>

customize 3

 

Authorized Text

We’ll also be adding some red “Authorized Personnel Only!” text just below the <form> tag. 

<style>
#wr_loginpostdesc {
    text-align:center;
    font-weight:bold;
    color:#ff0000;
}
</style>                    
<div id="wr_loginpostdesc">Authorized Personnel Only!</div>

customize 4

Feel free to modify the files within the template directories in order to customize your WebReports user interface.

We just modified the login screen to look like the following:

customize5

Keywords: WebReports Customize Login html code
511 Views
7/16/2013 3:24:15 PM
danielheth
danielheth's Avatar

Comments

Login or Register to leave comments!
pcpeteusa -
Fantastic Info Just what I needed
danielheth -
Always remember to follow best practices by backing up the original file BEFORE editing any of these templates. Also be sure to modify carefully as they are templates used by the application and I have not found any documentation related to modifying them. So consider this a HACK!!!