Niall a11n

Hi there @jennyrrr,

Thanks for sharing a screenshot showing the huge spacing between the header and main content! I see what you mean!

First, the code needs to be a tweaked a bit for the Storefront theme:

/* Hide breadcrumb on Storefront homepage */

.home .storefront-breadcrumb {
    display: none !important;
}

Please navigate to **WP Admin > Appearance > Customize > Additional CSS**, delete the other code, and add the snippet above. After that, click on Publish to save the changes.

The page should then look like this:

Link to image: https://d.pr/i/trWb3j

As for the additional block, that actually seems to be an empty paragraph block based on the code I’m seeing using my browser’s developer tools:

Link to image: https://d.pr/i/yHZdy8

When editing the section, you should be able to delete that empty block. Can you please share a screenshot of that so we can take a closer look?

Thank you!

Hi there @dicklim39,

Hope Elementor is now working on the site now! We haven’t heard back from you for a while, so I’m going to mark this post as resolved.

If you need any further help here, please let us know. Or, if you need additional help with the Storefront theme, please start a new thread and we’ll be able to help you out there.

Thank you!

Hi @suemeypl,

I hope the errors on the site have now been fixed! We haven’t heard back from you for a while, so I’m going to mark this post as resolved.

If you need any further help here, please let us know. Or, if you need additional help with the Storefront theme, please start a new thread and we’ll be able to help you out there.

Thank you!

Hi there @chumpi 👋

Thanks for reaching out to us about displaying more related products (4 exactly) at the bottom of product pages!

Is there anyway to fix this, preferably within the dashboard, customize, or with additional CSS?

Great question! I recommend adding the following code snippet your site using something like the free Code Snippets plugin available here on WordPress.org: Change number of related products output. That code will display 4 related products arranged in 2 columns, though you could adjust that as necessary.

For example, I set 4 related products and 4 columns on my test site, which displays 1 row of 4 products under a product:

Link to image: https://d.pr/i/97snkr

Just to clarify, the CSS won’t work, as only a maximum of 3 related products would be generated and displayed on the page. We’d need PHP like the snippet I shared above to ensure the site generates and displays the 4 related products, which should also fit on the page correctly for all devices too without additional CSS.

Please let us know if the PHP code snippet works for you!

• This reply was modified 4 years, 3 months ago by Niall a11n.

Hey @joshlfcox,

Thanks for the update; I’m glad to hear that seems to have worked!

I’m just double-checking with my client, as they know their catalogue far better than I do.

Awesome! Please let us know what they say 🙂

The site hasn’t changed plugins wise, for about 12 months (other than updates). Are there any plugins you believe would have caused the conflict? That will help narrow down my troubleshooting.

To clarify, as the System Status Report shows the site runs the latest WooCommerce 6.3.1 and Facebook for WooCommerce 2.6.12 versions, I’d say an auto-update might explain the origin of the conflict.

It’s hard to say which in the list might have caused the conflict. One thing you could try is to visit WooCommerce > Status > Logs and select the latest fatal-errors logs from the dropdown menu (that’d be something like fatal-errors-2022-03-15-XYZ....log for today) and see if there’s any plugins causing errors that might narrow down your search.

If not, please enable each plugin one by one until the sync issue reappears (you can manually sync when needed) and you find the culprit. You can read more about conflict testing here.

Please let us know if you need any further help!

Hi there @dicklim39,

Dicky, I hope you managed to add categories to the menu. We haven’t heard back from you for a while, so I’m going to mark this post as resolved now.

If you need any further help here, please let us know. Or, if you need additional help with the Storefront theme, please start a new thread and we’ll be able to help you out there.

Thank you!

Hi there @marioscomco,

Thanks for reaching out to us about the columns and CSS code on your Storefront site!

And the suggested codes from user Senff for 2, 3 or 4 columns don’t work, they make the columns spaces but only the far most left shows, the rest is just blank

I slightly modified it to width: 32% and it shows 3 columns right
BUT ONLY FOR MAIN SHOP PAGE, as soon as I open a category or subcategory it’s stock 1 column

Have any changes been made to the code since you posted this topic?

The reason I’m asking that is because I see 4 columns on both the homepage and Oro category page, for example:

Homepage screenshot:

Link to image: https://d.pr/i/npr7lj

Category page screenshot:

Link to image: https://d.pr/i/lNzoN8

Also, thanks to a developer I got these codes to: 1. Remove “add to cart” button, 2. Reduce vertical spacing between items, I just wanted to share to see if you had any opinion on this, thanks!

The code seem to be okay, though I don’t think it’d be necessary to got that deep in terms of the CSS selectors used.

Also, what’s the reason you’d like to remove the add to cart button? I’m assuming you just don’t want the button displaying on the homepage and shop category pages, right?

Hi @thewebmanwp17,

Hope you managed to get the font changed! We haven’t heard back from you for a while, so I’m going to mark this post as resolved now.

If you need any further help here, please let us know. Or, if you need additional help with the Storefront theme, please start a new thread and we’ll be able to help you out there.

Thank you!