Introduction to the OpenStack Dashboard

You can use the Floating IPs panel to view a list of allocated floating IP addresses. This information can also be accessed using the command line:

$ nova list --all-tenants

You must obtain a copy of the horizon container image. You can pull this image either into the undercloud or a separate client system running podman. To pull the horizon container image, run the following command:

$ sudo podman pull registry.redhat.io/rhosp15-rhel8/openstack-horizon

You can now use this image as a basis for a modified image.

The horizon container image is configured to use the Red Hat branded RCUE theme by default. You can use this theme as a basis for your own theme and extract a copy from the container image.

Make a directory for your theme:

$ mkdir ~/horizon-themes
$ cd ~/horizon-themes

Start a container that executes a null loop. For example, run the following command:

$ sudo podman run --rm -d --name horizon-temp registry.redhat.io/rhosp15-rhel8/openstack-horizon /usr/bin/sleep infinity

Copy the RCUE theme from the container to your local directory:

$ sudo podman cp -a horizon-temp:/usr/share/openstack-dashboard/openstack_dashboard/themes/rcue .

Kill the container:

$ sudo podman kill horizon-temp

You should now have a local copy of the RCUE theme.

To use RCUE as a basis, copy the entire RCUE theme directory rcue to a new location, for example mytheme:

$ cp -r rcue mytheme

To change a theme’s colors, graphics, fonts, among others, edit the files in mytheme. When editing this theme, check for all instances of rcue and ensure you change them to the new mytheme name. This includes paths, files, and directories.

To enable your theme in the dashboard container, you must create a file to override the AVAILABLE_THEMES parameter. Create a new file called _12_mytheme_theme.py in the horizon-themes directory and add the following content:

AVAILABLE_THEMES = [('mytheme', 'My Custom Theme', 'themes/mytheme')]

The 12 in the file name ensures this file is loaded after the RCUE file, which uses 11, and overrides the AVAILABLE_THEMES parameter.

You can also set custom parameters in the _12_mytheme_theme.py file. For example:

Once your custom theme is ready, you can create a new container image that enables and uses your theme. Use a dockerfile to generate a new container image using the original horizon image as a basis. The following is an example of a dockerfile:

FROM registry.redhat.io/rhosp15-rhel8/openstack-horizon
MAINTAINER Acme
LABEL name="rhosp15-rhel8/openstack-horizon-mytheme" vendor="Acme" version="0" release="1"
COPY mytheme /usr/share/openstack-dashboard/openstack_dashboard/themes/mytheme
COPY _12_mytheme_theme.py /etc/openstack-dashboard/local_settings.d/_12_mytheme_theme.py
RUN sudo chown horizon:horizon /etc/openstack-dashboard/local_settings.d/_12_mytheme_theme.py

Save this file in your horizon-themes directory as dockerfile.

To use the dockerfile to generate the new image, run the following command:

sudo podman build . -t "192.168.24.1:8787/rhosp15-rhel8/openstack-horizon-mytheme:0-1"

The -t option names and tags the resulting image. It uses the following syntax:

[LOCATION]/[NAME]:[TAG]

Push the resulting image to the undercloud’s container registry:

$ podman push 192.168.24.1:8787/rhosp15-rhel8/openstack-horizon-mytheme:0-1

To use the resulting container image with your overcloud deployment, edit the environment file that contains the list of container image locations. This environment file is usually named overcloud-images.yaml.

Edit the DockerHorizonConfigImage and DockerHorizonImage parameters to point to your modified container image. For example:

parameter_defaults:
  ...
  DockerHorizonConfigImage: 192.0.2.5:8787/rhosp15-rhel8/openstack-horizon-mytheme:0-1
  DockerHorizonImage: 192.0.2.5:8787/rhosp15-rhel8/openstack-horizon-mytheme:0-1
  ...

Save this new version of the overcloud-images.yaml file.

The director provides a set of horizon parameters you can modify using environment files. You can also use the ExtraConfig hook to set Puppet hieradata. For example, the default help URL points to https://access.redhat.com/documentation/en/red-hat-openstack-platform. You can modify this URL with the following environment file content:

parameter_defaults:
  ExtraConfig:
    horizon::help_url: "http://openstack.example.com"

To deploy the overcloud with your dashboard customizations, include the following environment files:

For example:

$ openstack overcloud deploy --templates \
    -e /home/stack/templates/overcloud-images.yaml \
    -e /home/stack/templates/help_url.yaml \
    [OTHER OPTIONS]