Hi,
I have googled like crazy and usually figure most thing out but...
I just upgraded to Joomla 4 and Helixultimate and when I click menu that displays Virtuemart products they are all just vertical after each other. One per row.
In have set in Virtuemart 4 items per row. Works on my live site but not in my development Joomla 4 site.
Maybe a simple solution but I cannot find it.
Any help would be greatly appreciated.
Thanks in advance.
Hello Peter Lombard
Apology for the inconvenience. I need to check it. Please share your issue page URL and administrator access here to check the issue. Use the Hidden Content box to share the credentials. Make sure that you have a full site backup before sharing.
Best regards
Hi Peter,
I think I know why.
In general VirtueMart is old software, and instead of using Booststrap 5 styles from Joomla 4/5 it still uses its own (legacy & tragedy) CSS code.
But with a few lines of extra Custom CSS you should be able to fix it, here is example:
.row > .width25, .row > .vm-col-4 {width: 25%;}
.row > .width33, .row > .vm-col-3 {width: 33%;}
.row > .width50, .row > .vm-col-6 {width: 50%;}Use it inside Template Options > Custom Code > Custom CSS
and you will have 4, 3 or 2 columns grid according to settings.
That's all we can help, now where you know the reason, whole rest is on your hands....
What would you recommend that is better than Virtuemart with same functions.
I mean I have all products, categories, links etc already setup.
Thanks!
For Joomla there are a few shops. Also we have it.
But if you already started...
CSS worked like a charm. Thanks!
But not on all categories. Will check more and get back if needed.
OK....
It works for most subcategories but not all.
Also I want images centered.
I put in the css code you suggested.
Here it works well
https://dev.nobleteam.se/dir/inomhussten/golv-vaegg/marmor
But another menuitem just vertical lineup
https://dev.nobleteam.se/dir/inomhussten/golv-vaegg/skiffer
Everything centered like this current site.
https://www.nobleteam.se/inomhussten/golv-vaegg/marmor
Peter, in general, Virtuemart design customization is beyond JoomShaper support.
About columns grid:
@media screen and (min-width: 440px) {
.product.vm-col.vm-col-5 {width: 50%;}
.product.vm-col.vm-col-3 {width: 33%;}
.product.vm-col.vm-col-4 {width: 25%;}
}Image center
.vm-product-media-container > a > img {
text-align: center; margin: 0 auto; }This was the last VM tip I shared here (!)
Actually I dont agree it is a virtuemart design customization.
With other packages and templates it works fine not just with Helix. As you can see with the other site I have and have tried other templates without changing any settings.
Anyhow love joomshaper and helix etc. Fast, great support etc.
Thanks :)