VirtueMart Forum

VirtueMart 2 + 3 + 4 => Templating & Layouts => Topic started by: ModestZou on April 13, 2015, 09:54:25 AM

Title: Joomla! 3.2.7 VM catalog list image size questions
Post by: ModestZou on April 13, 2015, 09:54:25 AM
Hi,

How change VM catalog list image size, I set in  VirtueMart  Configuration, but no change.

How can we solve this?

Any help is appreciated!

Kind regards,

Modest

Joomla! 3.2.7
VirtueMart 3.0.7.2
XAMPP V3.2.1
Title: Re: Joomla! 3.2.7 VM catalog list image size questions
Post by: jenkinhill on April 13, 2015, 10:58:05 AM
The image is constarined by css. Use Firebug to view the code & work out the overrides you need to make for your template.  http://forum.virtuemart.net/index.php?topic=116620.0

Look for  .browseProductImage  style settings.
Title: Re: Joomla! 3.2.7 VM catalog list image size questions
Post by: ModestZou on April 13, 2015, 11:35:24 AM
Hi jenkinhill,

I can't find any css control, I use Joomart Purity III template.

Thanks,

Modest
Title: Re: Joomla! 3.2.7 VM catalog list image size questions
Post by: GJC Web Design on April 13, 2015, 11:37:24 AM
bit unrealistic to expect someone to dig thru your css.. 

provide a live direct url
Title: Re: Joomla! 3.2.7 VM catalog list image size questions
Post by: ModestZou on April 13, 2015, 14:53:00 PM
Hi jenkinhill and GJC Web Design,

The problem has been solved.

in \components\com_virtuemart\assets\css\vm-ltr-site.css
.browseProductImage {max-height: 90px;width:auto;max-width: 100%;}
to
.browseProductImage {max-height: 200px;width:auto;max-width: 100%;}

Thank you,

Modest
Title: Re: Joomla! 3.2.7 VM catalog list image size questions
Post by: jenkinhill on April 13, 2015, 14:57:39 PM
NO. Make a css override or next week whn you update VirtueMart the edit will be lost.  http://docs.virtuemart.net/tutorials/templating-layouts/106-override-vmsite-ltr-css.html
Title: Re: Joomla! 3.2.7 VM catalog list image size questions
Post by: GJC Web Design on April 13, 2015, 19:36:08 PM
or just add it to an existing TEMPLATE css file with

.browseProductImage {max-height: 200px !important;width:auto !important;max-width: 100% !important;}