Configuring Branding and Logos in EngageIP

How to Change the Logo Within the EngageIP System

The only Accounts that have this capability are Accounts that have been set up as Owners. This means that all correspondents with their accounts will appear to be from this Owner.  For example, when invoices are sent to accounts of a specific Owner that is Branded, their Company Name, Logo and contact information such as the address will appear on the invoices sent and those settings are specified on this Branding Menu.

How to Ensure Your Address is on the Invoices you Create

1. Create a Billing Contact

2. Enter the Address in the Contact information fields

3. Enter as much information that you want to appear within the Invoice.

4. Save

To Set an Owner's Branding

1. Click Setup

2. Under the Accounts and Roles section select Branding

3. Enter the appropriate information in the fields provided as outlined below:

   • Company Name - Enter the Owner's Company Name which will appear on all forms of correspondences with their accounts. This includes email messages, invoices, etc.

   • Logo - Enter the link to the owner's logo. It is recommended that the maximum logo size is set to 120x35 pixels (if your logo exceeds these dimensions it will be automatically resized). Make sure that the logo is on the Webserver and that it is located in the images folder within the EngageIP install directory (example path :"http://localhost/AdminPortal/images/test-telecom.jpg"). The logo will appear on the upper left side of the EngageIP application.  When someone logs into the system they will see the logo of their branded owner.  If their owner is not branded then the logo of the next branded owner above the current owner in the owner tree will be displayed. If no logos are found whatsoever, the default application logo will be displayed. When logged in you will continue to only see YOUR owners logo, if you search for and go to a branded owner underneath your owner, your owners logo will still be displayed, not that branded owner's logo. If you login as the branded owner (or a user under that owner), then you will see that owner's logo (if it has been setup).
     
     Note: As of 8.5.27.x, if you want to update the logo on the login page itself, you need to edit the login css file per the image below.
     
     

     Open

     

      

   • Portal URL - When a ticket is created on an account and the option to email related to ( End Customer or Account Holder ) is selected and email message containing a URL to the customer portal will be included in the body of the message.  Enter the URL or Hostname that can be resolved by your end customers to access your customer portal. If no value is entered in this field, any external users may not be able to link directly to the ticket from the link in the message

   • Receipt Template - This section allows you to define a custom receipt which can be generated for one off payments using a page extension and custom code. Contact LogiSense for assistance if you need to add code to generate payment receipts

4. Click Save to Save your settings
   
   

Open

How to Change the Logo on the Login Screen

Some customers might prefer to change the logo as it appears below.

To do this perform these following steps:

1. Open the EngageIP install directory

2. Open the AdminPortal folder and navigate to the Views folder and open it

3. Scroll down to the Login folder and within it you should find index.vm

4. Update the following in your index.vm file:.login-area > .logo {
   height: 150px;
   background-image: url('$siteRoot/Content/images/YOURBUSINESS_logo.png');
   background-size: cover;
   background-position: center center;
   }

How to Remove the Bordering lines on the Login Screen

To do this perform these following steps:

1. Open the EngageIP install directory

2. Open the AdminPortal folder and navigate to the Views folder and open it

3. Scroll down to the Login folder and within it you should find index.css

4. Once you have opened index.css you should navigate to where you see the following
   
   

Instead of deleting the lines, in case for whatever reason you want to use them again,  you will "Comment" them out as you can see from the below example.