Background Images

yuuvis® RAD • 10.x »

By default, when you start yuuvis® RAD client, the background image bgr-dashboard.jpg, the logo logo.svg, and the sidebar image bgr_sidebar.jpg are displayed. However, it is also possible to display your own image files instead of these images in yuuvis® RAD client.

The required file format is JPG or PNG for background and sidebar images as well as other images and SVG for logos. Base the size of the background and sidebar image on the installed images: background image – 1600 x 1200 pixels, sidebar image – 300 x 250 pixels.

Check how they are displayed on different screens.

To customize the images, follow these steps

Follow these steps to create a custom configuration and work in the respective directories.

  1. Create a directory called \client\assets\_default\ in the <service-manager-data>\webresource\resources\ directory.
  2. Copy the \config\ and \theme\ directories from <service-manager-data>\webresource\public\client\assets\_default into the <service-manager-data>\webresource\resources\client\assets\_default\ directory.
  3. Place the desired image files in the <service-manager-data>\webresource\resources\client\assets\_default\theme\ directory.
  4. Open the main.json file in the <service-manager-data>\webresource\public\client\assets\_default\config\ directory in a text editor and change the value for the dashboardBackgroundImage, logo.svg, sideBarHeaderImage, appLogo, and headerLogo properties as follows:

    "dashboardBackgroundImage": ".\assets\_default\theme\[filename.ext]",

    "sideBarHeaderImage": ".\assets\_default\theme\[filename.ext]",

    "navBarLogo": ".\assets\_default\theme\[filename.ext]",

    "appLogo": ".\assets\_default\theme\[filename.ext]", (image for the login dialog)

    {"about": {"headerLogo": ".\assets\_default\theme\[filename.ext]"}} (image for the info page)

    .

    5. You can also customize the colors:

    "dashboardAppBarBackground": "transparent"

    "dashboardAppBarColor": "rgba(230, 0, 125, 1)"

    Color specifications: name of color, hexadecimal code, or RGB decimal code with opacity

  5. Save the file.
  6. Restart yuuvis® RAD client.

Alternatively, you can simply replace the background images. To do so, navigate to the <service-manager-data>\webresource\resources\client\assets\_default\theme\ directory and save your desired image file with the appropriate name. The configuration file does not need to be modified in this case.

Changes in the main.json configuration file can be overwritten by updates. If you enter the corresponding parameters in the extend.json configuration file located in the <service-manager-data>\webresource\resources\client\assets\_default\config\< directory, the changes are retained. We recommend you use only the extend.json file for configurations.