How do I add an image?

This is probably a simple question but I can’t figure out how to add an image. I’ve gone through the manual and that is no help.



When adding a product, on the Detailed Information tab, there are two sections for images: thumbnails and Popup. Where is the main large image for the product detail?

When I try to add an image into the thumbnail section, it is a large file.

I have thumbnail resizing turned on.



I was hoping that I could for instance upload a large 600x600 pixel image and then CS-Cart would create a smaller one for the product detail page of say 300x300 and another one for the thumbnail of 120x120. I don’t mind uploading multiple images and skipping but can’t figure out how. When I upload the large 600x600 to the popup section, it shows up on the product detail page.

It will auto-resize your thumbnail for you, if you just add the image directly to the “Popup larger image” only (that’s the large one). It will resize/optimize the “thumbnail” (the small one) for you, to match the size specifications you set in the admin backend, at Settings>Thumbnails



There isn’t an in-between size (the 300x300 in your hypothetical) - if you want the detailed popup to be 300 px, then you’ll just need to upload a 300 px image. Tons of programs out there to resize images

I don’t have a problem resizing. I was just confused by what CS-Cart did. Thanks for clarifying.



When I added a 600x600 image to the thumbnail section, it would show the 600x600 image on the product detail page and then just shrink the large file for thumbnails (still 600x600 but forced width/height to thumbnail size so image). I mistakenly thought the thumbnail would be resized.



Looks like the correct way is to upload the image to the Popup section and let CS-cart resize the thumbnail. This works but the product detail shows the smaller thumbnail size image. I think this is just going to be a functionality of CS-cart.



Here is what I would have liked to see that I’m used to with ZenCart and OSCommerce. I would upload a large pop-up image such as 600x600 and CS-Cart will automatically create a thumbnail 100x100 image AND a product detail image of 300x300. This way, the customer is not forced to have to open a pop-up to see a slightly larger image. I could just upload a 300x300 image to the thumbnail slot but then the thumbnail images would be bloated when sized at 100x100.



So ideally, there would be three size images. Maybe I’ll put in the request to CS-cart in their feature wishlist.



Thanks for your help in clarifying the situation.

After understanding how things work better, here is the compromised approach I took.



I have a 600x600 image that I uploaded to the Pop-up. No need to auto create a thumbnail.



I then uploaded a 300x300 image to the thumbnail at 50% quality. 80% quality had a 60K file and 50% quality is only 23K with hardly any image degradation.



I increased the thumbnail display size to 150x150 so the actual 300x300 image is not shrunk too much so it doesn’t distort the image. Smaller sizes would often result in block/jagged artifacts since the image is not natively sized.



Result:

  • small 150x150 thumbnail that is 22k (instead of about 8k if native sized) but is still decent quality and legible.
  • 300x300 image on the product detail page letting the customer see a much larger image without having to click on the pop-up link.
  • 600x600 pop-up for those that want things really big and detailed.



    In case anyone is curious, the site is www.endlessmtscabin.com and the only test product right now (7/31/07) is a maple cream. The site is not functional yet as we just installed CS-Cart a couple days ago and are configuring the site.

I was just going to post something similiar

I always upload 2 sizes…

125 X (whatever) for the thumb (which allows only a 125 width image on my details page…an 80 X image on the multicolumns page…then a 400 X (whatever) for the thickbox popup…(i do not exceed 800 height on the thickbox though for smaller screens/resolution)



only takes a little extra time to thumb the main images before adding

We take are own photos and have a script in photoshop that resizes/names the images to a thumbnail and larger size.

Like MikeFold we upload both images.

It is giving us a nice consistent look to our page.

Eric