Customization

From Domoticz
Revision as of 21:39, 21 March 2023 by Creasol (talk | contribs) (→‎Frontpage)
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to navigation Jump to search

New to Domoticz? Have a look at the Getting started page to connect your first devices, services or gateways.

There are a number of ways to modify the look and feel of Domoticz, ranging from simple CSS modification, through to complete replacement of the dashboard.

You can find current and popular modification on the Domotiz forum. Some examples are:


Built in Themes

You can change Domoticz a little bit through built-in themes, which mostly change the colour scheme. Dark themes are useful in case you have a tablet on your wall as an interface, so that it doesn't give too much light.

Do this by Menu Setup - Settings select another theme from the pull down list.

For a more information how to change the look of Domoticz go to How to theme Domoticz

Browser cache

The web frontend is set to be cached. This will speed up the application launch time, and is perfect if you create a shortcut on the home screen of an iPhone/iPad/….

When experimenting with themes be sure to refresh and/or clear the browser cache or appcache after each change.

Replacing icons

You can add Custom icons to the interface. Lots of users have created iconpacks. You can find those in the forum.(link)

An example

There is als a French user that has created a online Domoticz Icons Creator: https://domoticz-icon.aurelien-loyer.fr/

CSS themes

You can modify the CSS of Domoticz in two ways. The simple way is to install a browser plugin like Stylebot or Stylish, and let your browser override the style. You can then add the CSS via that plugin.

Another way is to modify a file in your Domoticz installation called custom.css. Whatever you add there will override the default styling. This will change the look for all browers, even those without plugin capability, like mobile phones.

CSS polish

Frontpage

You also can create your own Front page Creating a Custom Status Page It can be found on http://IP_OF_YOUR_DOMOTICZ:8080/views/frontpage.html

New frontpage forum topic

Skins

More rigorous modification of the theming system is possible too, where you replace more files.

ThinkTheme skin for Domoticz

Aurora Theme


Machinon Theme

Alternative dashboards

Some users have created complete alternative interfaces and dashboards that circumvent the default web interface completely.

Reacticz


Dashticz


PHP

Extra functionality can be added with PHP pages.

Domoticz supports serving PHP pages when started with the commandline parameter -php_cgi_path path_to_php_cgi (default /usr/bin/php-cgi)

Prerequisite is that php-cgi is installed: sudo apt update && apt install php-cgi

php file should be placed in folder domoticz\www.

Example

Create the following script in the www folder with name test.php:

<?php
print( $_SERVER["QUERY_STRING"]);
print("<br>");
print_r($_GET);
exit(0)
?>

Then request:

http://<domoticz-ip:port/test.php?test=123&moretexthere

This should give output like:

test=123&moretexthere
Array ( [/home/pi/domoticz/www/test_php] => [test] => 123 [SERVER_SOFTWARE] => Domoticz [SERVER_NAME] => localhost [SERVER_ADDR] => :: [SERVER_PORT] => 8080 [REMOTE_ADDR] => 192.168.178.11 [QUERY_STRING] => test=123 [moretexthere] => [HTTP_HOST] => test.pi.home:8080 [HTTP_CONNECTION] => keep-alive [HTTP_PRAGMA] => no-cache [HTTP_CACHE_CONTROL] => no-cache [HTTP_UPGRADE_INSECURE_REQUESTS] => 1 [HTTP_USER_AGENT] => Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/85.0.4183.83 Safari/537.36 [HTTP_ACCEPT] => text/html,application/xhtml xml,application/xml;q=0.9,image/avif,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.9 [HTTP_ACCEPT_ENCODING] => gzip, deflate [HTTP_ACCEPT_LANGUAGE] => en-NL,en;q=0.9,nl-NL;q=0.8,nl;q=0.7,en-US;q=0.6 [HTTP_COOKIE] => _ga=GA1.2.846285750.1591806061 )

Serving is done by fastcgi See github https://github.com/domoticz/domoticz/blob/development/webserver/fastcgi.cpp

Continue to the next page of the introduction

Automation