3SC Shopware Styling

This small guide is to clarify how you can add your own stylings to the 3SC extension. Before you start you might want to take a look here because the 3SC extension offers you the possibility to adjust colours to the web shop CI over the backend too.

Insert SCSS / CSS code

The styling files of the 3SC extension can be found at:

/shopware/custom/plugins/3scsw6/src/Resources/app/storefront/src/scss

However, these should not be edited! Since changes can be destroyed by an update!

To prevent an update of the 3SC extension from destroying changes. Should a separate SCSS file be created in the theme used and then overwrite the styles of the 3SC there.

tip

Every time a SCSS / CSS change is made to a theme, the current theme must be compiled so that changes can be transferred to the storefront.

Compile your Theme to show styling changes

Styling changes are only displayed after the active theme has been successfully compiled.

You can compile your stylings with this command: bin/build-storefront.sh && bin/console ca:cl