Printer Touchscreen Customization

Many manufacturers attach great importance to their own branding. Therefore, we offer printer manufacturers the possibility of adapting the optimized touchscreen interface with their own colors, texts, options and images themselves.

In installation directory\modules\front\www you find three templates for 1024×600, 1024×800 and 1280×800 pixels.

Important: Copy a template to a new modules folder, because the existing will be overwritten with every update!

In this example we create a new frontend modul, which we name MyFrontend.

1. Go to the folder installation directory\modules.
2. Create the folder MyFrontend and open this folder.
3. Create the folders lua and www. The folder lua remains empty.
4. Copy the following template folders to your new www folder:
   installation directory\modules\front\www\1024×600
   installation directory\modules\front\www\fonts
   installation directory\modules\front\www\js

Now you can call your new frontend at this URL: http://localhost:3344/mod/MyFrontend/1024×600/index.html

Open your folder installation directory\modules\MyFrontend\1024×600. Here you can adjust the HTML files, set your own images and adjust colors, font sizes, … in the CSS files.

For CSS we use Less, so you only need to adjust the variables.less file in the less folder. Then compile the panel.less file in installation directory\modules\MyFrontend\1024×600\css. For easy usage you can use a Less GUI compile like WinLess, if you are using Windows.

If you want to change even more, you can also change the HTML files and JavaScripts. Our examples use AngularJS. This makes it easy to code additional modifications.

In our documentations you will find more information to use our API to add new functions.