Related Github Documents
Document Properties
Last Modified
Added to KB
Public Access
Doc Type
Guidelines, Concepts & Cookbooks
Intershop Progressive Web App

Guide - Intershop Progressive Web App - Multiple Themes

Multiple Themes

It is possible to create multiple themes for the PWA.
This mechanism uses Angular configurations to replace files for each configuration.

The Intershop Progressive Web App currently uses multi-theming to provide different styles for the B2B an the B2C application.
The styles for B2B are defined in src/styles/themes/b2b/style.scss, for B2C in src/styles/themes/b2c/style.scss.

Using schematics to start customizing Intershop Progressive Web App prepares a theme for your own custom styling. (See Customizations - Start Customization)

Developing the PWA with only one Theme

To configure and run the Intershop PWA with only one project/brand specific theme start the customization by setting the <brand> theme as default theme.

node schematics/customization/add --default <brand>

This configures the <brand> theme as the only active theme in the package.json.
Besides that, all necessary configurations in angular.json, .eslintrc.json and override/schema.json are made and a new src/styles/themes/<brand> folder and environment.<brand>.ts is created that should be used for further project development.

NOTE: If only one theme is active, PM2 will run the theme-specific SSR process in cluster mode on the default port (see Building Multiple Themes).

Further References


The information provided in the Knowledge Base may not be applicable to all systems and situations. Intershop Communications will not be liable to any party for any direct or indirect damages resulting from the use of the Customer Support section of the Intershop Corporate Web site, including, without limitation, any lost profits, business interruption, loss of programs or other data on your information handling system.

Customer Support
Knowledge Base
Product Resources