In this article and video, I’ll explain how to build a web-based multimedia kiosk using a Raspberry Pi 4 or 5 and a touchscreen monitor.

But what is a multimedia kiosk?

Well, in general, a multimedia kiosk is nothing more than a device that allows the use of content in a controlled manner.

What does “controlled manner” mean?

It means that when the kiosk is turned on, it displays a predefined initial web page, and from there, the user can interact only with the active elements of the page that have been predefined; these could be buttons, images, or forms. The user can never leave the predefined paths or open other applications. In effect, it’s like a computer that can only run one program, and exiting that program is not allowed.

The multimedia kiosk allows for the use of a minimal user interface, stripped down to the bare minimum so as not to distract the user, allowing them to do only what the interface was designed for, and to do so in the simplest and most immediate way.

Kiosks are a common sight in our everyday lives, even if we often overlook them. Think of ATMs, queue booking systems at supermarkets or post offices, and gas stations.

This tutorial is updated to the new version of Debian 13, also known as Trixie.

WATCH THE VIDEO TUTORIAL ON YOUTUBE:

1. Installing the Raspbian Operating System on an SD Card

The first step is to prepare the SD card with the Raspbian operating system for your Raspberry Pi.

Download and install the Raspberry Pi Imager software from www.raspberrypi.com/software/

Launch the program and follow all the steps as described below:

Choose the target device type. In my case, it’s a Raspberry Pi 4.

Raspberry Pi Imager - Selecting the Target Device

Now, choose the operating system. It’s crucial NOT to choose the first Raspberry Pi OS options because these include the desktop environment with the graphical interface and all the main programs. Instead, we’ll choose the lite version (text console only, no graphical interface, and no additional software).

To do this, the first option is “Raspberry Pi OS (other)“:

Raspberry Pi Imager - Choosing an Operating System

The second option is Raspberry Pi OS Lite (64-bit).

Raspbian pi imager - 64-bit lite operating system selection

By clicking NEXT, we proceed to select the SD card that we previously inserted into our PC using an SD card reader. Select it and click NEXT.

Raspberry Pi Imager - SD Card Selection

Now let’s customize the installation. The first thing we’re asked for is the hostname, or network name we intend to give the Raspberry Pi.

Raspberry Pi Imager - Choosing a Hostname

We then choose the location settings, which will correctly set its time and keyboard layout.

Raspberry Pi Imager - Localization Settings

We’re asked for the username and password for authentication. I’m leaving “pi” as the username and setting a moderately complex password.

Raspberry Pi Imager - Username and Password Setup

Optional but recommended! We can directly configure the Wi-Fi access settings at this stage, so we can download the updates and software we need from the first reboot, and we can also connect via SSH from our PC for easier work.

We then enter the network name (SID) and password.

Raspberry Pi Imager - Wi-Fi Settings

Enable SSH on the next screen:

Raspberry Pi Imager - Enabling SSH

Leave the “Enable Raspberry Pi Connect” option unchecked.

Raspbian pi imager - pi connect

A summary is displayed and you’ll be asked to confirm writing to the SD card:

Raspberry Pi Imager - Confirmation for Writing

Wait for the files to be written and verified. Once complete, remove the SD card from your PC and insert it into your Raspberry Pi. Connect the monitor and keyboard to the Raspberry Pi and power it up.

WARNING!!: On some high-resolution monitors (WQHQ), the characters used for the console are displayed very small and therefore difficult to read. To make the characters larger, you can force a lower resolution for the terminal.

To force a lower resolution than the terminal, edit the file:

sudo nano /boot/firmware/cmdline.txt

and add the following line to the end of the file, separated by a space:

video=HDMI-A-1:1920x1080M@60

In this case, we’ve forced a resolution of 1920 x 1080 pixels. This value can also be changed as needed.

2. Updating Raspbian

The first time you boot, the Raspberry Pi will reboot a couple of times, after which the console login screen will appear with the word “login:”. If it doesn’t appear, press ENTER on the keyboard.

Log in with the chosen user “pi” and password. If the Wi-Fi settings are correct, you should be able to browse the internet. Download and install the Raspbian updates with the command:

sudo apt update && sudo apt upgrade -y

It will take a while to download and install everything. Finally, reboot with:

sudo reboot

For convenience, we could already issue all these commands by installing the Putty program on our PC and connecting to the IP address of our Raspberry. To find the IP address assigned to the Raspberry, type the following command on the Raspberry:

ip a
ip a gets raspberry ip addresses

In the above case, one address (the last one at the bottom) is that of the network interface connected to the Wi-Fi, while the first is the one obtained from an Ethernet cable that I connected to the Raspberry.

3. Configuration using raspi-config

Type the command:

sudo raspi-config

to access the Raspberry configuration tool called raspi-config.

the raspi-config interface

First, let’s enable auto-login, since the kiosk won’t ask for authentication. Enter the menu and confirm with YES:

1 System Options --> S6 Auto Login --> Yes

Enter the localization menu:

5 Localization Options --> L1 Locale

For Italian, scroll down to it_IT.UTF-8 UTF-8 and press the bar to select the corresponding item (an * is placed next to the item).

Raspi-config Localization Settings

and press ENTER.

Note: You’ll find the item: en_GB.UTF-8 UTF-8 already selected. Leave it selected!

To confirm, use the TAB key to move to and then press ENTER.

The next screen asks you which default language you want to set for the user. To set Italian, press the down arrow and select it_IT.UTF-8 and press ENTER.

Raspi-config Localization Settings in Italian

At this point, you’ll return to the main menu from which you can use.

4. Installing the required Software

We’ll install the software we’ll need to create our web kiosk, namely:

  • x-server-xorg is the X Window server, the engine that provides the graphical user interface
  • x11-xserver-utils are libraries that come with the X server to manage input/output devices, including the keyboard, mouse, monitor, etc.
  • xinit (https://wiki.debian.org/xinit), the program used to start the X server and an initial client program
  • openbox (https://wiki.debian.org/Openbox), the window manager
  • Chromium, the web page browser

We install everything with a single command:

sudo apt-get install --no-install-recommends xserver-xorg x11-xserver-utils xinit openbox chromium -y

5. Setting the Hosts File

If the page we want to view is hosted on a server in an intranet, it is recommended to to the Raspberry Pi where the server we want to reach is located. For example, if the browser needs to open the page http://mysite.local to resolve the name mysite.local, we’ll tell it which IP address it corresponds to.

Open the file in edit mode:

sudo nano /etc/hosts

and add the following line:

10.0.0.2 mysite.local

replacing 10.0.0.2 with the actual server address.

Important!! To prevent our changes from being overwritten upon reboot, edit the file:

sudo nano /etc/cloud/cloud.cfg

Find the following line and add a # in front of it to comment it out and thus disable rewriting of the hosts file.

#  - update_etc_hosts

6. Connectivity Check before Chromium launch

Let’s create a script to check for network connectivity so that the kiosk will only start if it can physically connect to the server. To do this, edit a file with the command:

sudo nano ~/.bash_profile

and copy these lines into it:

if [ -z "$DISPLAY" ] && [ "$(tty)" = "/dev/tty1" ]; then
until ping -c1 10.0.0.2 >/dev/null 2>&1; do
echo "Waiting for network availability…"
sleep 2
done
startx -- -nocursor
fi

replacing the address 10.0.0.2 with that of our server or the name of our site. This short script waits for communication with the server before launching the graphics engine. The command:

startx -- -nocursor

opens the graphical interface where the Chromium page will be rendered.

The “– – nocursor” option is optional and hides the mouse pointer.

7. Configuring what to display in the GUI

How do we specify what the GUI will display when opened?

Edit the file:

mkdir -p ~/.config/openbox
sudo nano ~/.config/openbox/autostart

and add these lines:

# change url as your needs
URL="http://miosito.local" # dont put spaces near =

xset s off # spegne screensaver
xset s noblank # evita schermo nero
xset -dpms # disattiva spegnimento HDMI

# Optional: set graphic resolutionand eventually screen rotation 90° left
#xrandr --output HDMI-1 --mode 1280x1024 --rotate left

# Optional: allows you to close the X server by pressing CTRL-ALT-Backspace
setxkbmap -option terminate:ctrl_alt_bksp

# Launch Chromium in kiosk mode
sed -i 's/"exited_cleanly":false/"exited_cleanly":true/' ~/.config/chromium/'Local State'
sed -i 's/"exited_cleanly":false/"exited_cleanly":true/; s/"exit_type":"[^"]\+"/"exit_type":"Normal"/' ~/.config/chromium/Default/Preferen>
chromium --disable-infobars \
--disk-cache-size=1 \
--disable-pinch \
--overscroll-history-navigation=0 \
--kiosk "$URL"

Edit the URL you want the kiosk to open:

URL=”http://mysite.local” # Be careful not to put spaces before or after =

When changing the URL to open

WARNING!!

The –overscroll-history-navigation=0 option should prevent Chromium from moving forward or backward in the history when you swipe left or right.

This parameter no longer works on the latest versions of Chromium, so the workaround I suggest, if you have control over the site’s content, is to:

Add this CSS to the web page:

html, body {
overscroll-behavior-x: none; /* server to avoid swiping history back and forward on chromium */
}

8. Reboot

We’re done. Reboot the Raspberry Pi with the command:

sudo reboot

After booting, you should see the kiosk page displayed full-screen.

Help me support this blog

If you want you can help me concretely to support this blog. You can do it with a free donation, by credit card or paypal. I will be grateful to you.