CSS Styling Modules Xperify

Code snippets: Object recognition

Code snippets: Module introduction popup

Code snippets: Screensaver

Code snippets: Media browser

Code snippets: Interactive map (3D)

Code snippets: Digital label

Code snippets: File cards

Code snippets: Pages and backgrounds

Code snippets: Navigation page

Code snippets: Menu items

Code snippets: Basic variables

General

You can copy paste these code-snippits in your advanced theme settings. Follow these steps:

  1. go to dashboard.ocularium.be

  2. go to the menu ‘themes'

  3. click on the second tab ‘advanced’

  4. Paste the code snippit

  5. Change the parameters and the ID.

You can find the correct ID’s by ‘inspecting’ the frontend. Follow these steps:

  1. Open Xperify (or preview it)

  2. Right-click on your page and choose ‘inspect’

  3. The inspector window opens

  4. Click on the button in the left corner

  5. Hoover over the element of Xperify that you want to change

  6. You can find now in the elements page of your inspector window the correct ID. Mostly mentioned as:

    1. .page.page--XXXX

    2. .page--XXXX module XXX

    3. .page-module

  7. In the right colom ‘styles’ you can find the same or other advanced code-snippits.

 

Kiosk

Shortcut commands

The packaged Electron application runs in fullscreen kiosk-mode meaning that standard keyboard shortcuts won't work.

To open the devtools:

ctrl + shift + x or command + shift + x

o refresh the browserwindow:

ctrl + shift + r or command + shift + r

To open the Ocularium-file:

ctrl + shift + o or command + shift + o

To open system information:

ctrl + shift + i or command + shift + i

To quit the Electron process entirely:

ctrl + shift + q or command + shift + q