Search code examples
spartacus-storefront

Supported characters for Configurable URLs in Spartacus

Does anyone know how to see supported characters which are handled by Spartacus in section Configurable URLs (especially second Note)?

Note: Some customers have product titles with special characters that will not work (for example, having a slash in the code or title). This might require special treatment of the attributes before or after they are used in the URL. Note that Spartacus does not include functionality for handling special characters.

Solution

  • The router configuration for product routes is driven by static ULR parts and dynamic content form the product model. By default, the product code and name are used in the route configuration, to build out the URL. You can however customise the so-called route parameters. This is a common thing to do when you need a pretty product name in the URL.

    Step 1: normalise the product model, by mapping the product name to a "pretty name". You can do this by implementing a normalizer:

    @Injectable({
  providedIn: 'root',
})
export class ProductPrettyNameNormalizer
  implements Converter<Occ.Product, Product> {
  convert(source: Occ.Product, target?: any): Product {
    target.prettyName = source.name.replace(/ /g, '-');
    return target;
  }
}

    The normalizer can be provided in Angular, using DI. https://github.com/tobi-or-not-tobi/spartacus-bootcamp/blob/master/src/app/features/routing/product-routes.module.ts shows you an example.

    Step 2: configure the router configuration to use the prettyName as a route parameter. You see an example of this in the fore-mentioned link.

    The actual mapping is up to the project. Spartacus does not have a standard mapping as of now.