6. Customization

LinOTP web components are based on templates and CSS. You may change the look and feel of the WebUI but we recommend not to change the default templates and style sheets, as an update may destroy your changes. Therefor you can define custom templates and style sheets.

6.1. Templates

In the file linotp.ini you can define a variable:

custom_templates = /etc/linotp2/custom-templates/

in the section [app:main]. All templates will be searched in this directory. If the template does not exist in this custom directory, the default template is used – usually from:

/usr/share/pyshared/linotp/templates.

So if you want to modify the look and feel, copy the template from the default location to this custom location and keep the structure of the sub directories. When you changed the custom templates you need to empty the Pylons cache:

rm /etc/linotp2/data/* -fr
/etc/init.d/apache2 restart

6.2. Style Sheets

The style sheets are located at /usr/lib/pymodules/python2.6/linotp/public/. The default styles sheets are located at:

linotp/public/manage/style.css
linotp/public/selfservice/style.css
linotp/public/openid/style.css

You can create the following files to overwrite the default style sheets. Creating these new files, will avoid the changes from being overwritten in case of a system update:

linotp/public/manage/custom-style.css
linotp/public/selfservice/custom-style.css
linotp/public/openid/custom-style.css

6.3. Changing the Logo

On the /manage and on the /selfservice portal you can change the logos easily. The LinOTP logo is defined as a background image of the div #logo. Take a look at the style sheets /usr/lib/pymodules/python2.6/linotp/public/manage/style.css and /usr/lib/pymodules/python2.6/linotp/public/selfservice/style.css. There is the id definition #logo which points the the corresponding image file at /usr/lib/pymodules/python2.6/linotp/public/images/. Change the style.css to your custom- style.css and drop in a new image.