Customizing Colors, Layout and Logo

Caveats

Sometimes browsers cache the logo or CSS, so hit Shift+F5 if your logo doesn't appear at first

Look and Feel

Create following files
/etc/sipxpbx/sipxplugin.beans.xml

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE beans PUBLIC "-//SPRING//DTD BEAN//EN" "classpath:org/sipfoundry/sipxconfig/site/spring-beans.dtd">
<beans>
  <!-- Optional definition to override any bean property -->
  <bean id="propsOverrider" class="org.springframework.beans.factory.config.PropertyOverrideConfigurer">
    <property name="properties">
      <props>
        <!-- value=myResources correlates with the bean myResources defined below -->
        <prop key="skin.messageSourceBeanId">myResources</prop>
      </props>
    </property>
  </bean> 

  <bean id="skinProperties" class="org.sipfoundry.sipxconfig.site.skin.SkinProperties">
    <property name="properties">
      <props>
        <!-- key=X.png correlates to /sipxconfig/skin/X.png (typically referenced in CSS) -->
        <prop key="logo.png">my-logo.png</prop>
        <prop key="login.jpg">my-login.jpg</prop>
        <prop key="custom.css">custom.css</prop>
        <prop key="favicon.ico">my-favicon.ico</prop>
      </props>
    </property>
  </bean>  

  <!-- Optional definition to override any string resource -->
  <bean id="myResources" class="org.springframework.context.support.ResourceBundleMessageSource">
    <property name="basename" value="myres"/>
  </bean>

</beans>

Notes:

You should custom.css file in /etc/sipxpbx/
Custom.css overrides css classes found in sipxecs.css (check this link https://github.com/sipXcom/sipxecs/blob/release-15.12/sipXconfig/web/src/org/sipfoundry/sipxconfig/site/skin/sipxecs.css)

If you define your own resources, simply create a file called myres.properties that contains strings definitions you'd like to alter.
/etc/sipxpbx/myres.properties

product.name=My Product

This file conforms to the Java's internationalization standards, so you can create a series of files to change the resource strings for any language (e.g. myres_fr.properties, etc)

Images

Create a logo
/etc/sipxpbx/my-logo.png with roughly the same dimensions as the sipxconfig logo

Colors (deprecated with 14.10 – all modifications need to be made in custom.css)

And create corresponding /etc/sipxpbx/my-colors.css

sipXconfig colors

Layout (deprecated with 14.10 – all modifications need to be made in custom.css)

/etc/sipxpbx/my-layout.css based on the default CSS files

sipXconfig layout

Hiding Tabs (deprecated with 14.10 – all modifications need to be made in custom.css)

CSS can be used to do this, for example if you want to hide Conference tab within user portal this should be added in css:

#voicemailFolders #For_0

{

display : none;

}

You can right click in browser > inspect element and see the path to the tab. You could then edit / see changes live with same console.

Advanced (deprecated with 14.10 – all modifications need to be made in custom.css)

You can change the names of any files except
```
sipxplugin.beans.xml
```
You can include all files including
```
sipxplugin.beans.xml
```
into a jar file and drop it into
```
/usr/share/sipxpbx/lib
```
This is part of a much larger plugin framework where you can change all sorts of default settings for sipxconfig.

Child pages