Custom field images display

[scoody]

Yes it works , it took you files in reply #34 , it's very cool !

The template.css provided in your zip has to go in components/com_virtuemart/assets/css and with template.css name or replace vmsite-ltr.css in this same folder ?

[cas]

Glad it works!  I keep asking the VM folks to make this view the default product view for VM.  You can ask them as well.   

The template.css file in my zip file is not to replace any existing file or add a new file.  What you do is to open this file and copy all the information in the file, and then paste this information into your existing template.css file in the templates/css folder.  I don't touch the vmsite-ltr.css file because when a new version of VM comes out, you might overwrite your changes in this file. 

Cheers!   

[cas]

Banquet,

Can you please make this the default view to help everyone out who uses custom fields?   Please!

Thanks,
Chuck

[PRO]

please outline exact changes here in a reply.

Not the whole file. because it will conflict with other new things that are changing the css etc.

[cas]

Hi Banquet,

In the attached zip file from reply #34, I recently updated it to use the latest version of the VM2.0.0 default.php file with your changes.  Of course I do not know since VM2.0.0 came out if there is a newer version of the default.php in the svn.  I do not have access to that.  If you send me the latest version I will be glad to update it for you.   As far as the template.css file, I only included the specific VM changes we made in that template.css file.  It's not a complete template.css file.  This way you can just add these css changes into the vmsite-ltr.css file.  Did I understand your request correctly?  I'm happy to do whatever I can to help you. 

Thanks!
Chuck

[PRO]

https://dev.virtuemart.net/svn/virtuemart/trunk/virtuemart/

and you still are gonna have to give exact changes. There are many things being worked on, and 2 people could mess up each others work.

[cas]

Hi Banquet,

The good news is that the latest default.php in the svn has all the changes we made before, except for one.  On line 202 the tooltip needs a line break at the end.  I added that line break in the attached default.php file.  Otherwise it's good to go.

I also took the latest vmsite-ltr.css file from the svn and added the css additions at the end of the file.  You can decide to integrate them better, but it works fine with my changes as is.

FYI, I did find one new problem in the new default.php. On line 128: class="product-image" was changed to class="medium-image", so the vmsite-ltr.css, which still has ".product-image" is not matching, and thus the main image is not controlled by the vmsite-ltr.css anymore.  In addition, now when hovering over the additional images, the main image shrinks to the small thumbnail size, so this is a problem too.  It needs to display the full size image when hovering over the additional images.  Anyway, this has nothing to do with what I'm doing with the custom field images, but just wanted to bring it to your attention so you can fix it before the next release comes out. 

Thanks,
Chuck

[attachment cleanup by admin]

[scoody]

Hi cas,

I try to follow you , it's almost clear for me, except when yo uare talking about the css files in templates ...

Which templates are you talking about, as there are so many files in front end back end , joomla template, VM template etc etc it's clear for you but not for me !!

So the modifications you propose in your template.css file shall be put in which file in /www/components/com_virtuemart/assets/css   ?

I have no default template, i want to avoid modifications in vrmfile.css .

[cas]

Hi Scoody,

I put these changes in my Joomla default template, which is in \your-root\templates\your-template\css\template.css.  You could also put these into the Virtuemart css, which is in \your-root\components\com_virtuemart\assets\css\vmsite-ltr.css.

[scoody]

ok, i updated my css file it "works", but the radio buttons are not alligned at all with the pictures , i have to change the % in the css file ?

[attachment cleanup by admin]

[cas]

Yes, you just adjust the width % in: .product-fields .product-field label {width:25%;}

If you use Firefox, then use Firebug add-on to easily tweak the width until you get it to look exactly how you like it.  I know other browsers have similar tools as well. 

When I look at your screenshot, I'm wondering why the first row is indented a few pixels from the other rows?  This might be what is causing you the problem.  Make sure the tool-tip is on it's own row and not interfering with the first row of the custom field images.

Cheers,
Chuck

[scoody]

21% not enough , 22% too much , i have to modify the size of my pictures in that case ?  why the 4 at right is not good, else all is ok !

picture with 22%

[attachment cleanup by admin]

[cas]

You can use decimal places as well... for example 21.4%.   But if that still doesn't work, then use different size thumbnail images.  My thumbnail images are 80px wide x 90px high, and I use 17% for the width.

[PRO]

you would use percentage in width, then pixels with padding

[scoody]

Hi,
Thanks a lot, but where is the padding,it's here :

.product-fields .product-field label {
   width:21%;
   float:left;
   position:relative;
   top:20px;
   left:-10px;
   
because 21% is not enough  (the 4th column is not aligned) , and 21.1 is too much !!! (i have a 5th radio button and 4 image on a row only)

Seems i have to redo my jpeg now it's the only solution ?