Changing the Interface of Embarcadero Connect

From Connect
Jump to: navigation, search

Go Up to Administrator Guide

You can change some aspects of the Embarcadero Connect interface to your own liking by editing the HTML and images in the program folders.

Warning.gif WARNING: The interface is not meant to be changed and any changes made will be overwritten if the product is reinstalled or upgraded. These instructions are solely for those who require changes and any files you intend to change should be backed up prior to making any changes.

Customized Login.png
Customized Main Screen.png

To change the Login page of Embarcadero Connect:

  1. From Windows, browse to your install directory. ..\Embarcadero Connect 3.0\tomcat\webapps\ROOT\jsp\Login.jsp.
  2. Open Login.jsp in a text editor (For example: Notepad.exe), scroll down to the section beginning <div id="site-content">
  3. Change the text inside the header tags <h1>Welcome to Embarcadero_Connect</h1> to change the title of the login page to the text of your choice.

There are two methods to change the Embarcadero logo to your own image:

  1. From Windows, browse to your install directory. Open ..\Embarcadero Connect 3.0\tomcat\webapps\ROOT\themes\new\assets
  2. Replace the embarcadero_logo.png with an image of equal size and name.


  1. From Windows, browse to your install directory. Open ..\Embarcadero Connect 3.0\tomcat\webapps\ROOT\WEB-INF\jsp\template directory.
  2. Here there are jsp files that have entries referencing the css files. Open the jsp files in a text editor (notepad.exe) and scroll to the sections you wish to view.
    • NewMainTemplate.jsp
      • <title>Embarcadero_Connect</title> is the title of the page in the browser.
        <div id="site-footer"> is the css match for the page footer.
        <div id="site-header"> is the css match for the page header.
      • <div id="company-logo"></div> is the match for the logo in the css file.
      Footer.jsp is where you will find css references for the logo at the bottom of the web page and the version number.
  3. The css matches in the above jsp files are referenced in ..\Embarcadero Connect 3.0\tomcat\webapps\ROOT\themes\new\global.css. You can see all the referenced areas that you may wish to change. For example, in the below selection from the css file, you can see the position, size and name of the png image file used for the logo. This is the image you would change to affect the site-header and company-logo in the templates.

#site-header #company-logo { position: absolute; top: 18px; left: 0; width: 200px; height: 28px; background: url(assets/embarcadero_logo.png) no-repeat; }

For the changes to take effect, you may need to refresh/restart your browser.

See Also