5.1. Icons

You can specify any HTML for an icon. It’s a popular choice to use Unicode icons because they are extremely fast to load and there are a lot of them.

Figure 3. Examples of icons in OliveTin

5.1.1. Unicode icons ("emoji")

For example on the here is a list of "Eomji" in unicode. If you find "Smiling face with sunglasses" you can click on it to see it’s "HTML-code". In OliveTin, you’d setup the icon like this;

  - title: Unicode (emoji) icon
    icon: "😎"
    shell: echo "You are awesome"

5.1.2. Full HTML icons (<img src …​)

You can also specify the full HTML for an image, like;

    - title: HTML (jpg/png/etc) icon
      icon: '<img src = "https://www.docker.com/sites/default/files/d8/2019-07/vertical-logo-monochromatic.png" width = "48px"/>'
      shell: docker ps
This full HTML thing is very customizable, but easier options will probably be added in the future as well.

5.1.3. Saving and serving icons for "offline" use

Sometimes you might want to store images to use as icons, with your installation of OliveTin. This can be useful when your installation is meant to be offline, or disconnected from the internet. This is easily done.

You should put icons in a new customIcons directory, inside the standard webui directory. The webui directory could be in a few different locations:

  • If you installed OliveTin with a package, this directory is normally /var/www/olivetin on Linux. Create the directory /var/www/olivetin/customIcons/.

  • If you installed OliveTin with a Linux Container, it’s probably best to bind mount a new volume into the container.

    `docker create jamesread/OliveTin --name OliveTin -v /opt/OliveTinIcons:/var/www/olivetin/customIcons ...`

Once you’ve created this customIcons directory. Place your icon, for example mrgreen.gif into this custom icon directory. Below is a picture of Mr Green. Feel free to save his likeness and awesomeness for yourself, for future awesome offline usage.

Mr Green
Figure 4. Mr Green, the original awesome smily.

In your OliveTin config, customize your command again using HTML, like this;

    - title: Mr Green
      icon: '<img src = "customIcons/mrgreen.gif" />'
      shell: echo "I don't like the word 'emoji' "

This will result in a locally hosted icon that will work offline, that looks like this;