Skip to content

Change settings at runtime

You can modify dynamic theme settings for content items at runtime without rebuilding your project locally. Instead of directly editing the settings.json file, you can pass parameters through your browser's address bar to override these settings.

Available settings

You can change at runtime the following selectors from settings.json:

  • theme corresponds to the current theme
  • scheme refers to the color scheme defined for the theme
  • clm takes code value from targetCLM
  • lang corresponds to the langs value from localization

How to change settings

  1. Start your project as a live-reload server:
    sh
    wiz dev --live
  2. Open http://localhost:3000/ in your browser
  3. Add the query parameters to the URL as follows:
    • ?lang=[LANGUAGE_CODE] changes the project localization
    • ?theme=[THEME_NAME] changes the theme
    • ?theme=[CLM_CODE] changes the target system

You can combine these parameters, connecting them with & to change multiple settings simultaneously. For example,

shell
http://localhost:3000/?lang=ukr&theme=aethercare&clm=irep

According to this example, your item will switch to:

  • Ukrainian localization
  • AetherCare theme
  • Targeted at the Veeva CRM

Runtime behavior

The implemented structure enables dynamic theme switching without requiring Sass file recompilation. When a theme change occurs:

  1. The system loads the new theme's index.scss.
  2. Associated styles from ./common/styles/theme.scss are applied.
  3. Theme changes take effect immediately.

This approach ensures efficient theme management while maintaining application performance.