How We Overcame Multilingual Struggles in Umbraco v8

Umbraco v8 introduced a new way of managing multilingual content and at first glance, everything looked great...but the devil was in the details. In this blog, I'll go through our obstacles and share the package we created to overcome them. I'll try to keep it as short as possible, I find it hard to go through long blog posts too!

Light at the end of the tunnel

A few years ago we inherited an Umbraco project based on V7 with 16 language versions for 29 countries. It was not implemented by experienced Umbraco developers and here’s just a couple of issues: multiple cache layers not synchronized and not attached properly to events (publishing, unpublishing etc.), custom url provider not registered properly (different URLS in backoffice and frontend) and many more. We flagged the issues to our client, explaining that maintenance and continuous development would be problematic - even for some small improvements we had to rewrite a bunch of code to do it the right way. We thought Umbraco v8 might just be our light at the end of the tunnel.

To make sure it wasn’t like the lights of an oncoming train, we decided to build a simple POC with our client to see if a new v8 approach would fit their requirements.

(We already had some projects implemented using v8 but not on such a vast multilingual scale).

The new multilingual approach in Umbraco v8

The default way of creating a multilingual website in Umbraco v7 was to create separate root nodes for specific cultures. In most cases, you're getting a complex content structure with a separate root node for each culture-specific domain.

In v8 you can approach it the same way but new deliverables give you the ability to create content variants for the same node, so there’s no need to implement custom solutions for this purpose - saving a lot of time and giving you standardized, simple and mature (used also in other CMS) way of managing multilingual content.

The Issues

Our client had some requirements based on their experience with v7 that became problematic with the new multilingual approach in v8:

Issue No 1: Ability to limit editorial access per language

Client's company has offices in 29 countries and it’s reflected in the current website content structure. As I mentioned earlier this content is using 16 languages spread into country content subtrees, each country office has the ability to give their editors access to only their content. With the new version of the website, the client would like to be able to assign rights with the same level of granularity but as we had to use single content trees for all cultures so we were not able to use the same approach of assigning a content node to an editor as we could on v7.

The solution could be to additionally limit editor rights to edit only specific language versions. It's currently not possible for v8 and IMO, it's a crucial feature for large multilingual websites. It was already a feature request over a year ago (Dec 2018) on Umbraco github repository, with community support, but it doesn't look like it will be available any time soon.

Issue No 2: Ability to set up navigation with multiple language versions

The client would like to be able to set up specific navigation for different cultures. To be clear here I need to give you an example. Let’s say we're setting up navigation for 'en-gb' culture, the editor should be able to add other nodes (other than 'en-gb') to this navigation like, 'en' nodes for instance.

Our plan was to use the Meganav package as we do for most of the v7 projects, our internal sources confirmed that a v8 version is coming soon. The problem here is that Meganav is using the default Multi Url Picker property editor which unfortunately does not support multiple languages and we were only able to select nodes from the default language version (in v8.5.4). Our idea was to contribute to core with fixes so I opened the feature request on Umbraco repository. Unfortunately, the request was closed and we had to figure out something else…

Our final feedback to the client was that we are not able to match his requirements out of the box in POC but there are some possibilities we could use to fulfil his needs.

'Freedom Friday' magic

Twice a month here at Cogworks we have a creativity & innovation fete called Freedom Friday. During this day we're able to work on anything related to our company/work we're interested in. Using this opportunity, I'm able to fulfill my need to fix at least some of my world's problems. One of those problems was obviously the inability to select the node's different language version in Multi Url Picker.

After consultation with the rest of our Dev team, I decided to build a custom package solving this international issue. The idea was to base our solution on default Multi Url Picker property editor - not implementing all features from scratch, just extending it with language selector, content tree and multilingual search (eventually we gave up on the last one).

With the modular way Umbraco implemented backoffice I was able to reuse most of the angular directives without the nugetneed to refactor it. The improved Multi Url Picker looks like this:

It's currently in beta version but you can get it from nuget to have a play: 

Install-Package Cogworks.MultilingualUrlPicker -Version 1.0.0-beta

Install-Package Cogworks.MultilingualUrlPicker -Version 1.0.0-beta

We're waiting for the next Freedom Fridays to improve it as it contains a few UI issues and needs further testing so feel free to contribute and help us make it better here.
 
Hopefully one day it will be part of core Umbraco!