VirtueMart Forum

VirtueMart 2 + 3 + 4 => Templating & Layouts => Topic started by: Eternity on March 09, 2015, 15:25:22 PM

Title: Category View Help
Post by: Eternity on March 09, 2015, 15:25:22 PM
Hello and sorry if this has been posted about already, but a search didn't bring anything useful up.

I am using VM 3.0.2 on J! 3.3.6  I will be upgrading as soon as this site is perfect.

I need to CHANGE the display of the product name in category view, at the moment it is pulling from my template h2 settings, but its too big for the names to display neatly so I need it to be smaller.  I don't mind changing it to h3 or h4 and making those smaller to suite VM, but I can't see where in VM I need to make the change, when I use firebug and remove the h2 at the end of the line of code it makes the block display better but not for the really long names, and when I put h3 in its place nothing happens.

Please can someone tell me which file and where to make the necessary change from h2 to either h3 or h4 so that my category view will look better.

Here is a link to the page that looks off at the moment: http://www.inspireaviation.com.au/index.php/component/virtuemart/flight-training?Itemid=224

I greatly appreciate your help :)
Title: Re: Category View Help
Post by: GJC Web Design on March 09, 2015, 16:59:30 PM
what's wrong with


.product.vm-col h2 {
font-size:16px;
}



you don't need to change html to do styling
Title: Re: Category View Help
Post by: Eternity on March 09, 2015, 17:26:09 PM
Hi GJC

Where is this?

.product.vm-col h2 {
font-size:16px;
}



Also, I need it to be smaller, the names must fit neatly into the block without over lapping the price etc, even though some of the product names are long they all need to look neat, so if I change it from h2 which my firebug tells me it is pulling from the template to h3 or h4 which are smaller it should work.

Otherwise is there somewhere I can make the product names in category view not pull from the template and be a suitable size but still bold?

Thanks
Title: Re: Category View Help
Post by: GJC Web Design on March 09, 2015, 18:17:55 PM
it's no where - add it..
Title: Re: Category View Help
Post by: jenkinhill on March 09, 2015, 18:23:54 PM
http://docs.virtuemart.net/tutorials/templating-layouts/106-override-vmsite-ltr-css.html
Title: Re: Category View Help
Post by: Eternity on March 10, 2015, 09:14:45 AM
Wonderful ... thank you ... can I just pop that code in at the bottom of the file??

Thanks for the link Jenkhill.  I just need to know where/how to make the necessary changes in the file first.
Title: Re: Category View Help
Post by: Eternity on March 10, 2015, 10:11:16 AM
Well I added the code into the bottom of the css file vm-ltr-site.css and it didn't help anything.

I am not sure whether or not my requirements are being understood here.

I need the font size of the product descriptions to be less so that the descriptions will display neatly.  I am guessing that by making it h3 or h4 instead of h2 it will pull from my template and be better.

Can anyone tell me where to make these changes please?
Title: Re: Category View Help
Post by: jenkinhill on March 10, 2015, 10:56:15 AM
I just looked at the page and see that you are using an Artisteer template. As crapisteer use their own non-standard Joomla css structure the "normal" solutions don't always work and changing styles and layouts can become a lot more difficult than with a normal Joomla template. It is logical to simply override css to make style changes but you may have to resort to using template overrides.

Templates involved are:
components/com_virtuemart/views/category/tmpl/default.php
components/com_virtuemart/sublayouts/categories.php
components/com_virtuemart/sublayouts/products.php
Title: Re: Category View Help
Post by: Eternity on March 10, 2015, 11:23:26 AM
Hi Jenkinhill

Yes it is an Artisteer template, a custom one at that.  As for the files you gave me, thanks.  It still doesn't tell me what I have to change where.  Are you able to assist with that?
Title: Re: Category View Help
Post by: Eternity on March 10, 2015, 14:16:30 PM
Never mind I got a fix that didn't require altering any VM files at all.
Title: Re: Category View Help
Post by: Jörgen on March 10, 2015, 16:19:19 PM
Did You maybe use !important  ?

Would You be able to share ?

regards

Jörgen @ Kreativ Fotografi
Title: Re: Category View Help
Post by: Eternity on March 11, 2015, 15:23:11 PM
Hi Jorgen

I added:

.vm-product-descr-container-0 h2 a:link {
font-size: 10px;
}

Into the bottom of my template.css between the comments of customized css and saved.  Worked like a charm.
Title: Re: Category View Help
Post by: Jörgen on March 12, 2015, 08:29:43 AM
great, thank you  8)

regards Jörgen @ Kreativ Ftotografi