I have a Tab element set up to manage the products. I’ve dropped category elements into their respective tabs, and it works as anticipated.
Two questions:
1) Is there any way to set up the Shop Page in WooCommerce settings, but NOT have all the products display by default, which winds up being in addition to the tabbed layout I’m using? I’ve got 4 tabs, and within them are a total of 31 products. Each tab contains between 3 and 12 products.
However, when I associate the shop page in WooCommerce Settings, I get another set of products underneath the tab element, where it says “Showing 1–4 of 31 results” on the left, and then on the right there’s a sorting dropdown.
The only way I know how to get rid of this is to not set it as the shop page in WooCommerce Settings. Is there any other way?
2) How do I remove the product category and subcategory from appearing in the product page breadcrumbs? I’ve already figured out how to redefine the Home page breadcrumb so that it points to the shop page I’ve set up. But, unless I can map the breadcrumb category back to the Section ID of the tab itself…I’m not sure that’d be even possible.
I’m OK with disabling the WooCommerce shop page default in WooCOmmerce settings. That solves the issue of the archive products appearing below the Tabs element I’ve set up.
However, I don’t want the user to be able to go backwards via the breadcrumbs without revisiting the tabs.
Cet.robywebdev.com/cet-store
Thank you!
Hi,
You could hide the breadcrumbs with some CSS, like this
– https://www.screencast.com/t/FGNz9dUNxb
Test this solution and see if it works properly
.woocommerce.single-product .entry-crumbs a:nth-child(3),
.woocommerce.single-product .entry-crumbs a:nth-child(5),
.woocommerce.single-product .entry-crumbs i:nth-child(2),
.woocommerce.single-product .entry-crumbs i:nth-child(4) {
display:none;
}
The section you mention will be displayed on the shop page, something has to be selected in the default shop page settings
– https://www.screencast.com/t/RaKPWSRbIQy
There could be plugins or code that you could use to remove it. Or maybe hide it with CSS.
Thanks
Thank you. I’ll test that CSS later this morning.
What would I be searching for in regards to plugins that would address the issue of the products appearing on the ‘defined’ shop page?
‘Prevent archive products from appearing on shop home page?’
The CSS works as expected.
I spoke with WooCommerce’s support earlier this morning, and they mentioned that the product loop that gets added by default to the store’s front page is defined by the product-archive.php file in TagDiv’s file hierarchy.
I need to know what code to place in the child theme’s functions.php file so that the product loop does not appear at all on the shop’s main page.
I tried to add the following CSS
body.home ul.products { display: none; }
..into the store page’s Visual Composer CSS container, but it doesn’t have the desired effect.
Hi,
Sorry, it seems I forgot about that. This is the file where the loop is called in the shop page
– https://www.screencast.com/t/TBdT2RWc
If you were to remove it or comment it from all the situations, or just for the layout you use, it will not be displayed anymore
– https://www.screencast.com/t/mF1YabnQ8dU2
Thanks
Yes, but I need to reference the removal in the child theme’s functions.php.
Can you provide me that code?
Thanks
Keith
I’m trying to set this up so that the next update to WooCommerce or perhaps the theme itself won’t wipe out any changes I’ve made.
Is it as simple as copying the product-archive.php file, making changes to the file and placing it in a woocommerce subdirectory of the child theme?
Hi,
I believe the Woocommerce files can be customized through a child theme. Copy the Woocommerce folder from the main theme, in the child theme folder. Then customize the file shown and comment or remove the line of code mentioned. Make tests and see if everything works properly.
Or maybe use this CSS in the child theme, check if it works proeprly
.archive.woocommerce-page .woocommerce-result-count,
.archive.woocommerce-page .woocommerce-ordering,
.archive.woocommerce-page ul.products,
.archive.woocommerce-page .page-nav {
display: none;
}
Thanks
