Reduce white space on product page title and drop down menu - Debut theme

Store Design
1

Problem:

  • on mobile view the white space above the title is too important

  • on both desktop and mobile the white space above drop down menus is too important

Please see screen shot enclosed

Where can I adjust that?

IMG_8892.jpg
IMG_8892.jpg1125Ă—2436 133 KB

1 Like
2

@SiteBuilder - you can simply use your own CSS targeting these areas. The quick & dirty way would be to append your rules to /assets/theme.(s)css(.liquid).

Mario

3

@SiteBuilder

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community! :blush:
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

4

Hey @SiteBuilder

Eunice here from Shopify, thanks for posting!

Shopify Support might be able to help you with this customization. If you’re on the Basic Shopify plan or higher, and you’re using a free vintage or Online Store 2.0 theme from Shopify, then you can use up to 60 minutes of complimentary design support, used in 15-minute increments. To learn if the customization you require is supported check out Shopify’s Design Policy.

To request a customization please contact Shopify Support via chat, callback, or email through the Shopify Help Center. This video clip shows you how to access the chat and email option. If you would prefer to speak with someone over the phone, please log in to your store when prompted to view the callback option. It’s good to note that callbacks are only available when capacity allows, so for the fastest support, I do recommend selecting the chat option.

Because you’re currently working on your product pages I thought you might like to check out this blog. When designing an online store, a lot of focus goes into the homepage, but to make sales you need awesome product pages. This blog provides inspiration by offering examples of stand-out product pages from real stores.

I hope this helps!

TwitterWhen designing an online store, a lot of focus goes into the homepage—after all, it’s the first thing visitors see when they arrive. But the real goal of any ecommerce website is sales, and there’s no way you’ll achieve that without stellar product pages.

LinkedIn When designing an online store, a lot of focus goes into the homepage—after all, it’s the first thing visitors see when they arrive. But the real goal of any ecommerce website is sales, and there’s no way you’ll achieve that without stellar product pag

5

@KetanKumar hi there,

https://bylderz.fr/products/ils-cassent-je-repare-t-shirt-100-coton-bio

6

@r8r my own CSS… I’m afraid I don’t know how to do that without more information

7

Sorry Mate!

8

@Puffnstuff thanks a lot for your input but I dont have “site wrapper” in theme.css, I also don’t have a theme.scss.liquid

1 Like
9

@SiteBuilder

yes please try this code

  1. Go to Online Store->Theme->Edit code
  2. Asset->/theme.css ->paste below code at the bottom of the file.
    this code apply for after 5 - 6 second
@media only screen and (max-width: 749px) {
.product-single__media-group {
    margin-bottom: 0;
}
.product-form {
padding-top: 0;
}
}
1 Like