I have a Sparkling theme WP-site with WooCommerce as a webshop. The main webshop page shows only two products on a row, but I would like to show three or four on a row. I’ve installed the plugin WooCommerce Product Archive Customiser, but it does not work regarding the amount of products shown on each row on the main page of the webshop.
I’ve added this code from the WooCommerce site, but it does not help.
// Change number or products per row to 3
add_filter(‘loop_shop_columns’, ‘loop_columns’);
if (!function_exists(‘loop_columns’)) {
function loop_columns() {
return 3; // 3 products per row
}
}
Been searching forums and adding codes all morning, but nothing seem to work and I hope you guys have a magic solution.
Thanks for the reply! I’v installed the plugin, but this one does not seem to work either. So I suppose something in the theme itself overrules the plugins? But i’m no expert at al. I’ve added this code to my functions php, but it did not work:
// Change number or products per row to 3
add_filter('loop_shop_columns', 'loop_columns');
if (!function_exists('loop_columns')) {
function loop_columns() {
return 3; // 3 products per row
}
Here’s the link to my webshop:
historische verhalen.nl/winkel/
So it’s about the amount of products on each row. According to the settings, there has to be four in a row, although it only shows two next to each other. Adjusting the size of the images does not help either.
Thanks for the answer! The plugin does not work, i can adjust the rows in the settings, but it does not actually change the amount of products in the row. I’ve added the Woocommerce code to my function php, but it does help. I guess the theme is overruling the plugin? Or did i do something wrong in adding the Woocommerce code?
There must be something on your site causing this issue.
Please clear the cache from W3 Total Cache or temporary disable it.
Also this can be due to plugin conflict on your site so please try temporary deactivating all plugins except Woocommerce and see whether everything works fine and then enable the plugins one by one to see which plugin is conflicting if any.
If i reactive W3 Total Cache, it looks normal again. So I figured the plugin for the archive messed up the lay-out - since activating W3 blocks this plugin - but turning that one off does not solve the problem.
Update:
I have this code in my css:
.woocommerce div.product div.images img{
width: 0;
}
Which makes the product image not appear on the single product page. So when I delete this code, the image appears and fit perfectly in the amount of space that is now left over because the text is all the way to the left. So my theory is that the image does not actually disappears, but only is not visible. I don’t know if it actually works this way, but it might give you something extra to work with?
Thanks! deactivating W3 Total Cache did the trick. I would however like to keep using W3 TC, as far as I understood its a rather useful one.
You don’t need to keep W3 Total Cache disabled but just clear its all cache whenever you make changes in the theme or plugin settings.
Another problem turned up: the text on the product page itself now only uses half the space:
https://www.historischeverhalen.nl/product/historische-verhalen-2016-bundel/
You can try resolving this issue by adding the following CSS code in the Custom CSS option of the latest version of Sparkling theme on the below path.
Admin Area -> Appearance -> Customize -> Additional CSS
