Search code examples
spartacus-storefront

Spartacus header slots not respect the configuration

I made the following configuration in the Spartacus Module Configuration:

 layoutSlots: {
        header: {
          slots: ['MiniCart'],
        },
        footer: {
          slots: []
        },
        LandingPage2Template: {
          slots: []
        }
      }

It correctly removes the footer and the content of the layout, but doesn't remove the header. It renders it fully, completely ignoring the configuration. Refer to this documentation. It's a bug or I made some mistake?

Solution

  • It's a unfortunate result of a feature ;) Any custom configuration is deeply merged with the Spartacus default config.

    In this case, you likely use the B2cStorefrontModule, which comes with a default layout config for the header. In the default header config, however, specific slot configurations are added for some breakpoints:

      header: {
    lg: { 
      slots: [x, y, z]
    }
  }

    The resulting (merged) config, will contain both the default config for the lg breakpoint, and your custom header slots.

    The LayoutService will take the right slots based on the breakpoint. Hence you likely don't see the changes in desktop mode (i'm guessing smaller screens work).

    2 ways to fix it:

    • don't use the B2cStorefrontModule, but use the StorefrontModule instead. This one doesn't provide a layout config at all
    • override also the lg configuration, i.e. lg: {slots: []}.