---
myst:
  html_meta:
    "description": "Adjusting the visual representation of Plone with Diazo"
    "property=og:description": "Adjusting the visual representation of Plone with Diazo"
    "property=og:title": "Plone 6 Classic UI Theming"
    "keywords": "Plone, Classic UI, theming, training"
---

(theming-label)=

# Plone 6 Classic UI Theming

Theming for Plone 6 Classic UI based on Bootstrap 5

**Training Objective**

This training will explain how to adjust the layout and design of a Plone site.
It will cover basic customizations you can do {term}`TTW` (Through-The-Web) in your Plone site,
as well as advanced theming methods and tools to create stunning themes for your Plone website based on existing HTML templates.

Level
: All levels

**You should be familiar with**
- Basic experience with Plone
- Basic HTML, CSS and JS Knowledge
- Basic npm knowledge


**Things to bring**

A linux based laptop (Ubuntu, macOS) with code editor of your choice (we recommend VS Code) and with Plone installed as described in training instructions. It is extremely important that you join the class with a working Plone installation. You need npm (package manager) to build your CSS/JavaScript.

```{toctree}
:caption: Plone Theming
:maxdepth: 1
:numbered: true

preparation
ttw_customizations
theme_barceloneta
theme_scratch
theme_diazo
```


```{seealso}
- {doc}`../theming_plone_5/index`
```