How to center your navigation in shopware 5?

Center Your Navigation in Shopware 5

First, You have to create a custom theme. To create a custom theme you can go through the below link.

Now, To centre your navigation in shopware 5 follow the following steps:

Our navigation looks like this.

Step 1:
 Go to the shopware theme directory of your website.

Step 2: Create the new sub-directory called main-navigation.less in _modules directory.

File Structure:


Note: Custom directory is a theme that I created already.

This image has an empty alt attribute; its file name is Screenshot_6-980x449.png

Step 3: Write this code in the main-navigation.less file.

@media screen and (min-width: @tabletViewportWidth) {
            text-align: center;

Step 4: Import main-navigation.less file in all.less file.

This image has an empty alt attribute; its file name is Screenshot_4-6.png

Write this code in all.less file.

@import "_modules/main-navigation";


Please contact us at or call us at +91-8800519180 for any support related to shopware 5. You can also visit the Shopware 5 development page to check the services we offer.