Search

Use custom CSS

CSS is a design language that is used on most websites. You can customise the design of your shop with the help of custom CSS code. For example, you can use it to hide certain elements.

Any changes are valid for your entire shop, not just for the page that is shown in the Editor while you are editing the CSS code. However, the custom CSS code has no effect on the design of your shop's checkout.

Custom CSS code can alter the design and functionality of your shop in an undesired way and also have a negative impact on the responsive design of your shop.
Only experienced users should enter their own CSS code. Check your shop carefully after making any changes. Also note that automatic updates can affect the custom code in your shop. Therefore, check regularly whether the CSS code you have entered still fulfils its purpose or whether the design and functionality have been affected by possible updates.

How to add custom CSS code

  1. In the sidebar of the administration, navigate to Editor.
  2. Select ThemeCustomizationIcon.png in the bottom bar.
  3. Open the tab CustomCSSIcon.png.
  4. Add your custom CSS code.
    To remove all added content again, select Reset below the code field.
  5. Once you are done, select Save.
    It will be automatically checked whether the CSS code you have entered is valid. It is only possible to save valid CSS code.

The custom CSS code has been added to your shop. To check that everything is displayed correctly or if any problems have occurred, select View your shop in the top bar.

Info

The settings for your custom CSS code are only applied to the currently selected theme. If you change the theme, the custom CSS code will no longer be applied to your shop. If you switch back to the previously selected theme, the custom CSS code will be applied to your shop again.
It is not necessary to specify a stylesheet type for the custom CSS code.

Use of custom CSS for colour settings

Customising the colours of your shop is best done via the colour settings. For further information, refer to Change the colours of your shop. If you change the colours via custom CSS code instead, this may overwrite the colour settings.

If you change the colours of your shop again, you may need to adjust the border and padding of certain elements in your custom CSS code.

Was this article helpful?