Product List Plugin on Single Product Page

Hi there @thedrumdoctor,

We appreciate you reaching out to us about the widget set up on your shop page.

To help you further, it’d be great if you could share the following

• The name of the Product List Plugin you’re using and a link to where you got it from
• A screenshot of the section in the Appearance > Customize > Widgets where the widget is set up
• A screenshot of the shop page and single product page

If you don’t already have a screenshot service installed, here are a few free options:

• https://snipboard.io
• https://skitch.com/
• https://getcloudapp.com/
• https://awesomescreenshot.com/

There is also a walkthrough guide here.

If the site is live, could you please share the URLs for the shop page and a single product page for us to better understand the problem?

Thank you!

Thanks for getting back to me.

I’m actually not using a plugin to display products on the home page (and yes, I have set the site’s homepage to ‘Home’). I’m using the theme’s option to place widget area below the header to which, I’ve added 2 Woocommerce widgets. The first holds the latest posts and the second holds a display of the newest products.

The widget container for the latest posts renders in HTML as:
<div id=”block-3″ class=”widget widget_block widget_recent_entries”>

The widget container for the newest products renders in HTML as:
<div id=”block-6″ class=”widget widget_block”><div data-block-name=”woocommerce/product-new” data-columns=”4″ class=”wc-block-grid wp-block-product-new wc-block-product-new has-4-columns has-multiple-rows”>

Now this renders as I want it on the home page which has a body CSS class of “home page-template”.

When I click on a single product on the home page the body CSS class changes to “product-template-default”, but the widgets below the header still render on this page.

I only want these widgets to display on the home page – not any other product pages. Obviously, I can add a ‘display: none’ rule on the widgets for every class of page I don’t want them to appear, but surely there is something I can do in my child theme to do this?

When a site visitor clicks on one of the newest products on the home page, a good theme design should allow the visitor to immediately click through to the product page without any other clutter on the product page. If the widgets below the header are always set to render on every page without any way of setting them to specific pages, then the UI becomes very user-unfriendly, especially on mobile screens where screen-space is premium.

Using CSS to hide widgets is not ideal in 2021! The theme should give more control over the pages they render on.

Also, I meant to type ‘Widget’ in the topic title instead of ‘Plugin’!

Hi there @thedrumdoctor,

Thanks for sharing more details about the widget used and that the content should only be displayed on the home page and not anywhere else.

Based on what I’m understanding, I think the Below header widget area was used, correct?

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

Just to clarify, Storefront widgets don’t have the option by default to be displayed only on specific pages and there’s no specific home page widget.

As an alternative, WooCommerce Blocks could be used to set up a custom home page where the content in the widget could be added specifically to the page (and therefore not on other pages).

Or, a page builder plugin could be use to add and customize the display of widgets.

It would also be great to have you add your idea for improving Storefront to the Storefront Ideas Board, which is where developers go to look for future plugin features and improvements. The other option is to submit a feature enhancement request on the Storefront theme’s Github repository.

Please let us know if you have any further questions!

Thanks for that information!

The Woocommerce Blocks idea seems like the way forward in this case – though I’d never heard of the plugin before you mentioned it.

I didn’t know there was Storefront ideas page either. I’ll check that out now and see what other people are asking. In the meantime, I shall proceed on the dev site with the blocks plugin as it looks like it’ll do the job.

Howdy @thedrumdoctor

You are very welcome :).

In the meantime, I shall proceed on the dev site with the blocks plugin as it looks like it’ll do the job.

Sounds like a plan. Happy setup!

Kind regards,