Centura

[Guy Verville]

https://www.centura.ca

We finally put Centura's national website online. A whole journey of a year and a half that began with an important phase of analysis.

Centura is one of Canada's leading distributors of floor and wall coverings. Seven administrative regions with different prices, four user profiles each with their privileges, daily synchronization with an inventory system, an ElasticSearch search and a concern for speed, these are the main challenges in the development of this site. And of course, everything must be adapted to the mobile. 

It is a smooth launch, without drum or trumpet, to stabilize the site, to know the reactions of the administrators, the pleasures and frustrations of the users.
The primary goal was to provide a national showcase for this important distributor. Centura has an inventory system that includes tens of thousands of products, the SKUs. However, this large database does not contain descriptions or groupings by collections.

So we used ProcessWire as a central data management point, where images and text meet inventory. Since Centura is divided into seven administrative regions with 14 distribution centres, it was essential to leave control over the local aspects of these divisions, such as opening hours, collections sold in the region, promotions, etc. In addition, one region, London and Windsor, is going it alone. It was important to add it to the list and direct the visitor to the right region (and another CMS).

As a distributor, Centura deals with retailers to sell its products. He also negotiates at a higher level with architects and construction contractors. Four types of users were identified.

1. The consumer who can keep favorites in his profile.
2. The retailer who can query the central inventory and who has access to promotions and other documents.
3. The architect or designer who can order free samples.
4. The installer interested in ordering tools or installation products.

Apart from consumers, the remaining types of members are managed (approved) by each branch. The branch administrators therefore had to be able to "visualize", to locate this information in the tree structure. This involved creating four types of profiles, four main forms, allowing everyone to have a custom dashboard. People registered in these profiles are registered "under" each branch.

Let us not forget the daily synchronization, done at night, in order to reflect new products, price changes, etc.. Since the new SKUs are "orphaned" before being associated to a collection, the import mechanism, inspired at the base of the module the Ryan Cramer, Import Pages from CSV, allows to identify what has been changed from what is new. This last category is placed in the tree structure under a page called Orphaned Skus. The site managers can create collections in the Products section and associates through a Page reference field the SKUs. When saving, since SKUs now have an association, they are pushed under the collection, so administrators can easily spot what belongs to what.

This large site required the intensive use of various fields, including Page reference, Repeater Matrix. The ProFields collection was a great help, as was ListerPro, widely used by both us and the administrators. What a choice to create batch actions with custom actions! This last module would however deserve a little more love, because it is a little more difficult to understand for the administrator user. We also used Form Builder, but the programmers preferred to build the four main forms themselves, as too much interaction was needed with other components of the site. The documentation for this module is anemic. If the use of the module speaks for itself, its use by API is immediately more cryptic. However, we promise to explore it further in order to leave as much control as possible to the administrator.

Another aspect that could be improved in ProcessWire is language management. The internationalization system is fantastic and we have nothing to say about it, but the translation of coded texts is rather hell. For the administrator user, finding a translation and modifying it is very complicated and sometimes incomprehensible. Indeed, what is marked by the __("token") function can be changed in two places for each translation (English and French in our case). But when the time comes to modify these translations again, you have to remember that it is the "token" that governs the search... Moreover, unlike Drupal, if identical __("token") commands are found in different PHP files, you have to translate them in several places!  There are ways to use pages inside the site to feed all translations of the site, this takes time and good planning. You can also use a central translation file, but with large sites, it can become cumbersome.

There are two types of search in this site. The search by facets of coating products required the use of Elasticsearch which allowed an almost instantaneous display of products.
For tools and installation products, we used a more standard model, built with ProcessWire. Why two search systems? There was a questions of time and budget here. The second search is quite different in practice.

Caching the site was of course important. Several obstacles to this one: the use of numerous cookies, in particular those of the choice of region and language by the user, the regional variation of the prices, the variation also of the collections to show. Finally, nginx in node balancing. Unfortunately, we could not use the ProCache module, depending on the htaccess file. It is possible to translate ProCache rules into nginx rules. We were, however, reluctant to depend on something over which we had little control. So we opted instead to pull the strings of the cache, as we saw fit, with the features of ProcessWire. It should also be remembered that nginx also has very powerful caching features.
In the near future, however, we will revisit ProCache.

We, at Spiria, love working with ProcessWire. The more we create sites with this CMS, the more we develop reusable components, which greatly speeds up the creation process. At the moment, we are setting up four "microsites" of products for another company. These sites will then be linked to a central site for "information exchange". In another case, we have to create two sites that operate in parallel. The customer wants to manage the information in a single site while pushing to a second certain information.

Our main challenge remains the notoriety of ProcessWire which is sometimes difficult to sell against giants such as Wordpress and Drupal. However, by creating sites the size of Centura, we are confident that this great CMF/CMS will take its rightful place.

Speaking of Centura, the journey continues. An online shop will be created, as well as a blog. ProcessWire makes it possible to create solutions adapted to each company without escalating costs. In other words, you can easily do without Wordpress plugins or Drupal modules, because a customized solution is always more profitable than trying to deconstruct what others have done.

Translated with www.DeepL.com/Translator

 

[dragan]

Congrats to such a nice-looking, professional and big site-launch!

59 minutes ago, Guy Verville said:

the translation of coded texts is rather hell

It depends how you are using it. If you already have the ProFields package, you should have used https://processwire.com/blog/posts/functional-fields/

That way, you can have one central tpl/page, and store every single string that needs to be translateable in one place. For bigger sites, it's a godsend. Read the above post and try it out sometime.

[Guy Verville]

Thank you Dragan, 

I was not really aware of the functional fields. This can be handy indeed while I see the putting everything in a Variables section of the tree is more friendly to end users. But the functional fields is certainly something to inquire!

[adrian]

Nice looking site - just a quick FYI that until you have defined your region/language, the logo doesn't display. Also, I wonder if it' worth selecting these automatically based on IP address first and letting the user change if they want rather than being forced to do this straight up?

[Guy Verville]

Hi Adrian,

Which browser you use? For the region selection, the IP detection is not a practical solution as some "region" are quite near of each other (for example Peterborough, Toronto or Hamilton). Where do you divide the line between them? It could be easier for the Maritimes, or in Quebec. Again, this is difficult because someone, for example, living in Trois-Rivières (middle of the province), might decide to go to Montreal instead of Quebec city. Another example are those living near Ottawa, but on the Quebec side (Gatineau). Quebec retailers are linked to Montreal, but the consumer might decide to go to Ottawa, etc. Since there were no clear answers to that, our client has decided to make people choose the region.

As for the language, there is already a detection of the browser language but, again, a lot of people use an English OS while they speak French... ?

[adrian]

I just tried all browser and they of course all have the logo issue. The src looks like this:

<img id="color" alt="Centura logo" src="">

Of course I see the issues with location/language selection ?

[Guy Verville]

The change to the region selector has changed recently. Weird that the logo code has not followed. Thanks for this. I will make this corrected first in the next morning.

update: strange, the code calling the logo is the same for every situation. I don't have this issue here. The source the problem seems related to cache.

[Klenkes]

To add to the confusion... sitting in Germany, Chrome and FF, the logo is there and just fine with no language or region selected.

[Guy Verville]

No confusion here. The presence of the log has been fixed meanwhile ?

[adrian]

2 hours ago, Guy Verville said:

No confusion here. The presence of the log has been fixed meanwhile ?

Looks good now - thanks!

[Soma]

I can't enter the site, cause I'm swiss and there's no language and Region listed for me. Shame.

[Guy Verville]

No popup window?

[Soma]

Sure, very offending... but nothing for me to select, so I simply leave. ?

[Guy Verville]

ah ah! ok, you made me freak. This is a Canadian company for canadian business. ?