Caleffi.com: why a multinational corporation has chosen Drupal

Caleffi is a company with 1000+ employees, distributed among the main Italian branch and the foreign ones, it sells its products in more than 70 countries and has a gross revenue of 250+ million euros. Let's have a look at how we managed to build their new digital headquaters.

˅
Estimated time reading
10 m 14 sec

This article paves the way for our "case study" section, where we will show off our most interesting projects, the challenges (both organizational and technical) we face every day: an open window on our world, a place where we share what we do with the fun and passion that characterize our day to day job.

The caleffi project

Together with H-ART that has curated the strategic analysis, the graphic concept and the intercation design, we developed Caleffi's online presence, we raised our personal bar in terms of Drupal projects.

Who is Caleffi?

Caleffi is a company with 1000+ employees, distributed among the main Italian headquarters and the foreign branches, it sells its products in more than 70 countries and has a consolidated turnover of 250+ million euros. Let’s have a look at how we managed to build their new digital headquarters.

This article paves the way for our “case study” section, where we will show off our most interesting projects, the challenges (both organizational and technical) we face every day: an open window on our world, a place where we share what we do with the fun and passion that characterize our day to day job.

Caleffi is a manufacturer of high-quality components for heating, plumbing, air conditioning, heat metering and renewables systems, for domestic and industrial plants. Their products are very likely installed in your houses and offices without you even know about it.

Currently, the group is made up of 14 companies and 2 representative offices. It employs over 1000 people spread across the Italian headquarters and the foreign branches. It distributes its products in more than 70 countries and has a turnover close to 250 million euros.

The 3 production plants are all established in Italy for strategic reasons: to ensure real compliance with quality standards imposed not only by international regulations but also by specific corporate choices. Control is effective and monitored in-house on 100% of production.

An interesting aspect of Caleffi’s approach is that the company invests a lot of resources in fostering the knowledge of the installers, HVAC wholesalers and planners.

Here you can find all the information regarding the company, a company that truly represents the “Made in Italy” excellence.

The Drupal project

Caleffi’s main wish was having a system flexible enough to adapt to the company’s changing requirements. A system that could empower the editors so that they could easily and individually create content. At the same time the system had to be able to be fully integrated with the internal and external technological systems of the company.

The challenge was not a small one: we were asked to substitute the previous document and content management system (a closed source Java software) with a more modern, modulare and user friendly system, one that could match both the pre-existing content creation workflows and the company growth needs.

Some numbers

What better way to figure out the size of the challenge than by reading some of numbers at play?

Here are some numbers for reference:

  • 12 Catalogs
  • 20k+ Products
  • 5k+ documentation files
  • 12 Countries, 18 languages (9 more countries by the end of the year)
  • 7900+ pageviews/day.

The system enables Caleffi to activate new countries in complete autonomy, without any external intervention.

The technological solution

Here's something that we like to talk about a little bit more, the technological stack.

We are going to describe some of our architectural and technological choices, focusing on the key components of the project. We will unveil the "behind the scenes" of our day to day work in Twinbit. Sharing is caring :-)

Multy-country and multi-language

Caleffi, as a multinational corporation has several branches in many countries, and one of the most important specification that was handed to us was to provide a sytem that could empower the different teams around the world to create content in their native language, while at the same time being able to keep a common theme, menu and page layouts across countries.

So from the very beginning a multi-country and multi-language system had to be implemented.

The concept of the Country in our system is something that has these 3 main characteristics

  • Users
  • Languages
  • Product Catalog

There are also several other kinds of pages that must be translated and gathered under the "Country" umbrella: some examples include the omnipresent "Contact Us", "Where we are", "Job Postings", "Product Guide", ...

The implementation

The implementation is mainly based on the native i18n features of Drupal along with the following set of contrib modules:

What we did is usign these modules as APIs, as a basis to develop the features we needed.

The concept of the "country" as outlined above has been implemented using the Organic Group module the let us

Where [country-name] is directly related to the organic group and [country-language] is one of the country's languages (the one currently active).

Detecting the language based on the URL structure has been done implementing a new language provider via a custom implementation of hook_language_negotiation_info

php /** * Implements hook_language_negotiation_info(). */ function caleffi_i18n_language_negotiation_info() { $providers = array(); $providers['caleffi_i18n'] = array( 'callbacks' => array( 'language' => 'caleffi_i18n_language_from_url', 'url_rewrite' => 'caleffi_i18n_language_url_rewrite_url', 'switcher' => 'caleffi_i18n_locale_language_switcher_url', ), 'file' => drupal_get_path('module', 'caleffi_i18n') . '/caleffi_i18n.module', 'weight' => -10, 'name' => t('Caleffi i18n lang selection'), 'description' => t('Determine the language from the URL: Country and Language prefix.'), ); return $providers; }

Search

Search is another main feature of the system. The user has to be able to search a product among the ones in a catalog based on one or more weighted keywords (most importantly the product code). The user should also be able to search based on the description and on the title (other keywords of the document) but the results based on these keywords should be less priority.

This is a classic example of a full text search requirement, a requirement that we satisfied using the Apache Solr indexing engine.

Here's an example that shows this algorithm in action:

http://www.caleffi.com/italy/it/products/search?query=527

As you can see from the screenshot the search results are many and varied but the products that have the specific product code appear first.

This is a common requirement and thanks to the Drupal ecosystem of contrib modules it is possible to create search systems that are both technically advanced and adaptable to the client's needs. The following link that shows off a documentation system shows exactly this.

Tech Tips

The modules we used are:

Mobile

Another requirement was to have a mobile optimized version of the website, showing a specific version of the editorial contents and a particular attention to the layout of the catalog and its search pages.

Again Drupal has been the ideal tool to satisfy this requirement: we managed to have only one backend editorial piece of content and a separate frontend theme specifically developed for mobile devices. This implementation enabled us to leverage all the existing implementation used for the "desktop" optimized version also on the mobile version of the website, with no additional costs.

Beside the mobile version of the website, we also supported all the touch gestures in the Desktop version, and all the images are "retina ready" in order to be fully enjoyable on the new 4K monitors.

Tech tips

The modules we used are:

In order to easily detect, even during development, if a device is mobile or not we developed the following function:

```php /** * Check if the client is a mobile device */ function caleffi_client_is_mobile() { // force mobile theme if (variable_get('caleffi_mobile_force_is_mobile', false)) { return true; }

$data = _context_mobile_detect_detect(); if ($data['device'] == 1) { return TRUE; } return FALSE; } ```

minisections and singlepages

Today the editorial requirements for a web platform can be many and varied; all too often we have been asked by clients to manage some content, inside the main website, using a different layout or theme.

This usually happens so that the client can feature more prominently a new product, or a specific subset of products (e.g. during Black Friday).

Single page: Experience

http://www.caleffi.com/italy/it/experience/discover

Minisection: heating systems

[sistemi-calore-home.png]

Tech tips

The modules we used are:

SEO and performance

Content index on search enginges and performances are usually two main features that are always required in projects of a certain size.

We have rewritten the output of the fields using semantic markup. This has greatly reduced the size of the markup on the page. This rewriting, brought benefic effects both on loading times and on search engine indexing.

In order to reduce the number of HTTP requests, we made large use of image sprites to compose all the elements on the page, and we also made sure that all the javascript plugins are being loaded only if necessary.

All the CSS stylesheets have been written using a modular approach known as SMACSS. This has lead to great manutenibility of the website so far, but it's also a future-proof solution when there will be updates to the underlying Drupal core. All of this has been designed to provide Caleffi with great flexibility.

Tech tips

The modules we used are:

Development Workflow

In our Drupal based workflow these are the modules that we always use:

Features, in particular, is a must-have, since it seperates cleanly code and content.

Patches & Contribution

These are the patches to the contrib modules that we developed during this project:

"Paying it forward" is a way to make open source development profitable for everyone.

Conclusions

Nowadays your online presence has to be seen as a more encompassing "platform" rather than a simple website. The clients keep asking us to centralize and integrate their online presence with their pre-existing production workflows. At the same time the requirement is to have a more modern technological stack, ready for change.

For us it has been enlightening to work on this project. We helped a robust Italian company to improve their online presence and to improve their business process.

We are always looking for new challenges and new interesting projects. If you want more informations on Drupal or if you want a new technological partner to help you support your growth, our Drupal experts are at a fingertip away. Feel free to write to us or follow our social channels, Facebook or Twitter

Latest posts from Paolo Mainardi

  • Drupal is a tool that allows you to develop web...

Keep in touch

Enter your email address below to receive all our latest articles and announcements via email.