Reducing spacing /padding between home page sections on symmetry theme

[charliedriver]

Can anyone offer advice please?

We have started to use the symmetry theme and found that the spacing/padding between the home page sections is quite excessive for some reason, how could we reduce this please? 

[Don]

Hi there @charliedriver!

How you can get support for a theme would depend on where that theme was originally created.

In this case, as you're using the Symmetry theme from our theme store this is created and developed by Clean Canvas themes.

You can check out their support resources for the Symmetry theme here and you can contact them directly here. 

That said, we generally do not recommend the removal of whitespace for design reasons, as it plays a role in making your site easier to navigate and read.

Added white space gives emphasis to your call to action buttons and key information. White space lets your visitors breathe and appreciate the website better since things are laid out well and easy to spot. 

There's some good info on the importance of whitespace you can check out on this external site.

If you'd like to go ahead anyway, you can check in with your theme developers to see what they might be able to support in terms of customisation.

Should they not be able to provide support for this, you can still look into getting some professional help from a Shopify Expert.

Would you still be setting up your store here and working towards launch? 

Can you tell me a bit more about what it is you're selling and what stage your business is at?

[charliedriver]

Hi Don,

I have designed the store for Everytopbrand.com , we purchased the theme yesterday and published it but the store owner is not happy with these excessive spaces and I must agree with him , the padding is over the top.

When compared with a professional store like www.next.co.uk and many others , they do not have these large spaces.

Clean canvas has declined to point me in the direction of exactly where to pinpoint the relevant code, instead recommending we employ a developer which will be an expensive option, especially after paying $300 for the theme.

Its just a matter of changing the pixels figures in the padding.

We had the same issue using the minimal theme 4 years ago , but as that was a shopify supported theme, the shopify tech team made the alterations on our behalf free of charge.

Thanks for your input into this problem

[dmwwebartisan]

@charliedriver 

Please share your store URL!

Thanks!

[charliedriver]

https://everytopbrand.com/

[GavinChan]

Hi @charliedriver ,

You can follow the steps below:

1. Go to Online Theme -> edit code -> Asset -> style.css
2. add the following CSS code snippet to the end of the file

.pageheader .logo {
    text-align: center;
    padding: 0px;
}

It should work.

PS: please use @ to mention me because I turn off email notifications.

[avaskye]

Hi @GavinChan ! I'm trying to follow the code you provided above to reduce the spacing between each section for the symmetry theme; however, I don't see Online Theme -> edit code -> Asset -> style.css. Is there another location where I can put this code? Thank you!