noritarte

Hey, Jarrett, when you got time, can you take a look at it? The problem can also be seen in the first line of products: when the title goes on two lines, the grids are no longer aligned because the height changes. Is there anything I can do? Thank you very much

When the product title is on one line they are in line, but if the product title is on two lines (it can happen if the title is long) a step is created (see for example the third and fourth line).

Great, I’ve upgraded and everything works! There’s only one thing to fix: when I view the site from mobile some product titles go on two or maximum three lines and create a misalignment between the various products, how could I fix it?

It works! Jarret, you’re super! Thanks a lot

Thank you, it works! Now the structure is ok but there is an little problem: the author name in the shop page is written very big, in the single product page (under the title) is medium size, and in the related products (visible at the bottom of the single product page) the author’s name is very small.

It would be perfect to uniform the style of the shop font with the style of the related products. It’s strange because they were the same size.

I started to try it on a few pages and it works great, I don’t know how to thank you for the very clear explanation. I have only one last request: on the single product pages I understood how to do it, but on the pages with more aggregated products (shop, categories, etc.) I don’t see the author anymore. I guess it’s possible to do it, because in the site that I have indicated as reference the names of the authors are present everywhere, do you know how to help me?

Thank you for the answer, footer spacing on mobile is perfect now, thanks.
Also the css .site .storefront-breadcrumb works but only in some pages. In the pages managed by woocommerce (account and checkout for example) the space remains larger but I can also settle for that if it’s a complicated issue to solve.
Many thanks for your help

This is one of the css I’ve tried:

/* Remove whitespace below header */

.storefront-full-width-content.woocommerce-cart .entry-header,
.storefront-full-width-content.woocommerce-checkout .entry-header,
.storefront-full-width-content.woocommerce-account .entry-header,
.storefront-full-width-content .woocommerce-products-header {
padding-bottom: 0px;
}

It works perfectly! Thanks a lot for the help

Thank you, i checked it but confirm that i have all my buttons with white text and black background. The problem is that only mini cart button has dark grey background and black text. Maybe I changed something without knowing, but I can’t find it.

It works perfectly, thank you!

Ok thank you, with your directions I was able to change the distances as I wanted.
I consider this topic solved, thanks again!

There’s still one small problem. Your solution works perfectly for the logo, but it creates some collateral problems: the search box in the sidebar gets bigger and the grid of products shrinks: if each line should contain 4 products, after I insert your css shows three products, because the container is reduced. What could be the problem?

Thanks a lot, I just tested it on mobile and it works perfectly! In the desktop version I tried to adapt your css like this:

.site-footer .footer-widgets div {
margin-bottom: 10px;
margin-top: -30px;
}
.site-footer .site-info {
padding-top: 5;
}

It’s pretty good even if the site-info with credits has a little too much space above and below, how could I fix it?

Thanks for the help: this solves the problem of the distance between site info and site footer, but inside the footer I put 3 html elements in 3 different columns (footer column 1, 2 and 3). If I see them on desktop no problem because they are on the same horizontal level, but on mobile the columns are placed one on top of the other and I wanted to reduce the distance between the various elements.