Product Page Margin/Padding Bug

Hi, when I’m building my product page using layouts, a large white gap appears at the top of the page.

I know about the -40px margin and this has been included. When I use Preview, it looks perfect, but this only happens when I publish. See screenshots.

The other issue I am running into is the “email” checkout field is missing in the checkout. It is activated in the Checkout Fields manager but doesn’t appear on the live site.

Attachments:

You must be logged in to view attached files.

Hello,

1. In order to make it work, you need to set the same header in Theme Settings -> Single product -> Custom single product header: https://prnt.sc/ATTj74epXK4N

2. Try to disable the “WooPayments” plugin, clear the cache and recheck the issue – https://prnt.sc/ATzxw1_DrER2

Kind Regards

Setting the custom header worked, but it randomly made the header “white” instead of transparent, like on all the other pages. I want the header to take on the background color. If I have to define a color I would like to input the BG color.

Hello,

For the first section set the -60px – https://prnt.sc/81J30UVqhcPR and apply the code below to change the color:

.single-product  .whb-header {
    background-color: #f8f7f1;
}

Kind Regards

Hi, the CSS you provided isn’t seeming to change the color.

Hello,

Applied the code for the Desktop area (https://prnt.sc/hQHC9Xz2EMkm) and on my side, I see that it works – https://prnt.sc/91IE6vQmFMJ-, please recheck it and let me know.

Kind Regards

The background page color and the header color are not the same in your screenshot.

The header is pure white. The background color is a cream color.

Hello,

To make it transparent on the product page, use the code below:

.single-product  .whb-general-header {
    background-color: transparent;
}

https://prnt.sc/WdY-bD-HYSLi

Kind Regards

[Author]

Posts