How to add hreflang tags in SAP Spartacus

Question

We have multiple basestores with multiple languages and want to implement the hreflang tags to all pages (if easier, it might not include cart and checkout) telling the searchengines that there are multiple versions of the same page in different languages.

We followed the guide on Automatic Context Configuration to provide the multiple basestores. We also added the SiteContextSelectorComponent to allow the user to change the language. At the moment all pages face the same structure: https://company.com/us/en/c/CategoryName -> where us is the country and en the language

Other examples:
https://company.com/us/es/c/CategoryName -> us store with spanish language https://company.com/us/de/c/CategoryName -> us store with german language https://company.com/de/de/c/CategoryName -> de german store with german language

The hreflang tags should be generated like

Working with meta resolvers might not work, due to the fact, that the tags are link and not meta.

So what's the spartcus way to do this?

A (angular) solution might be, injecting the document and adding the tags this way. But is this really the preferred way? And a further question would be, where's the right place to add these tags (on languageswitch? or routechange?)

Kind regards and thanks for your help, Andreas

user_11734692 · Answer

At the moment of writing, Spartacus doesn't have a mechanism for declaring in the of the document the language-oriented alternate URLs.

However, Spartacus already implements the mechanism for resolving the canonical URL. It's based on the concept of multiple PageMetaResolvers and the core PageMetaService. Then the SeoMetaService observes the resolved meta-data for the current page and updates the document with appropriate canonical URL link, title, and other data.

You will need to write a customization for "alternate" links. And here are my recommendations how to do it:

extend the SeoMetaService and perhaps PageMetaLinkService - for phisically placing the links in the head of the document
perhaps extend the PageMetaConfig and PageMetaService for resolving specific values for your alternate links

The concrete strategy of resolving the "alternate" links might vary from customer to customer. Your case seems to be simple, since you don't have any localisation of the URL segments (e.g. /category/xxx in English vs. /categoría/xxx in Spanish). Your URLs seem to only vary in the URL prefix - the standard URL site context. Then you can derive your specific "alternate" links from the canonical URL (which Spartacus already have implemented) and replace only the language in the prefix of the URL path, e.g. using a RegExp.

Since you don't need a different strategy of resolving "alternate" links for different pages (e.g. different strategy for PDP and different for PLP), then you might "hardcode" your way of resolving "alternate" links either in your customized PageMetaService or SeoMetaService. In other words, you won't need to bother with customizing each and every existing PageMetaResolver.

How to add hreflang tags in SAP Spartacus

1 Answers