Career portal

About the project

A career website relaunch implemented from scratch in a new Drupal version and with a new design. Most CMS pages are composed of multiple editorial components (Paragraphs in Drupal speak), which means the frontend needs to be modular and robust against whatever the content editors submit. Also the site is available in English an in German.

Scope

I was responsible for and implemented most of the frontend. The design came from an external designer. On the backend-side my job was to build several different editorial modules, the blog page including filters and highlighted posts, the newsroom, the opener and other functionality.

Architecture

The site is built with Drupal 8 and the theme is based on Bootstrap 4. Assets are compiled and minified through a Gulp script and an SVG sprite is generated for the use of icons. Some external APIs are used, for example to fetch the job offers and social media posts.

Challenges

Some of the more challenging problems to be solved included:

• The page opener: it can contain either an image or both an image and a video. In case a video is provided, it fades in smoothly to avoid an ugly flickering when it appears. The video may or may not be looped. When no video is provided or for some reason it cannot be loaded, the image is shown as a fallback. On mobile devices, the video should not load at all.
• The global search form provides the user with auto-suggestions and the search results are grouped by content types.
• A keyboard-accessible navigation, search form and autosuggest layer.
• Some teasers can have parallax elements, which must work no matter where the module is placed on the page.
• The user can see an overview of social media posts from different sources in the newsroom.
• The site supports multilingual content.

Tech Stack

• Drupal 8
• Bootstrap 4
• SCSS
• jQuery
• Gulp