Skip to main content
Drudesk
Olivero - das neue Frontend-Theme von Drupal 9

Attention "dusty"!

This article is already a little outdated and may contain information that no longer corresponds to the current status of the topic.

This is an article translated from English by https://wishdesk.com/drupal-consulting-and-development

What exactly makes a good CMS theme? An exciting question! Good design and an appealing appearance are probably the first attributes that come to mind. But a theme should not only be visually appealing, it should also be responsive and accessible, as well as being able to easily support all the functions that are essential for modern websites.

Olivero - the future frontend theme for Drupal 9 - promises this and much more. As Drupal 9 is already just around the corner and is expected to be released in mid-2020, we will use this article to provide an overview of Olivero.

Why is the theme of a website important?

Generally speaking, a theme defines the user interface of a website. This includes layout, color schemes, typography, display of buttons and much more. A beautiful theme ensures that the website is visually appealing to visitors and also embodies the identity of a brand. But that's not all.

In addition to being responsible for the basic appearance, a theme can also contribute significantly to a user's smooth interaction with the website. For example, a beautiful website design with good usability can ultimately lead to more conversions.

The new Olivero theme in Drupal 9

The official theme page describes Drupal 9 as "The most beautiful CMS ever!". This may sound a bit over the top, but if you look at a few of the screenshots, you can't help but at least consider this statement.

Olivero is the final product of the community's idea to create a new standard theme for Drupal. The current theme, Bartik, is already ten years old and was originally created for Drupal 7.

Bartik has long served as an appealing and highly customizable theme. The theme is responsive, in line with D8's mobile-first philosophy, but Bartik's design looks a little dated these days. Due to the many advances Drupal has made since the release of Bartik, it was only logical to develop a new main frontend theme that better showcases Drupal's strengths. Thus Olivero was born and is expected to be available in Drupal 9.1.

Theme in honor of Rachel Olivero

Drupal has a long tradition of naming its standard themes after deserving programmers. For example, Bartik was named after Jean Bartik, who was one of the original developers of ENIAC computers.

The tradition now continues with Olivero. The theme was named after a programmer named Rachel Olivero, who repeatedly campaigned for the accessibility of websites and sadly passed away this year.

The most important functions of Olivero

The most important features of the theme include its responsive design, simplicity, professional look, accessibility, website flexibility and much more. In the following, we would like to take a closer look at at least some of its numerous functions.

Compliance with WCAG AA

One of the top priorities for the theme's developers was to make Olivero compliant with the Web Content Accessibility Guidelines (WCAG), which was ensured by working with a team of experts. The goal is to enable all users to easily navigate the website with Olivero.

Support for the latest Drupal features

It was also important for the creators of Olivero to support the latest Drupal features, such as the layout builder, media embeds, second-level navigation and many more.

Modern color palette

Olivero's color scheme with the light blue base color not only looks much more attractive and modern, but also supports the Drupal branding. Combinations of darker and lighter colors contribute to the accessibility of the website.

Simple but modern forms and buttons

Forms and buttons are user-friendly and accessible with Olivero. There is a color bar on the left edge of fields and the labels are above the fields to meet the accessibility requirements of the website. Buttons are displayed in two different ways: primary and secondary.

A practical sidebar region

Olivero has a sidebar to the right of the main content area of the website where, for example, related content can be added. By dividing the different regions, the content area is highlighted, while the sidebar continues to serve as a useful support.

Flexible header and navigation options

The header of the main navigation can be converted into a hamburger menu when scrolling so that the menu is always accessible on long and mobile pages. Secondary drop-down menus are also supported by Olivero.

RTL text direction support (from right to left)

Drupal 8 had already set the bar very high for multilingual support. With Olivero in Drupal 9, however, the bar will be raised again.

At the moment, Olivero really does look like a significant improvement and a much-needed refresh of the Bartik theme. We are already looking forward to "The most beautiful CMS ever!" and are excited to try it out in Drupal 9.