[Solved] Thickbox images showing smaller than original images

[lettersets]

Hi,

 

I am using the image zoom function, but the cover images are showing up smaller than the original sizes in the pop up window.

 

You can see it here:

http://www.letterset...sweet-duck.html

 

- I have tried regenerating the product thumbnails

- I haven't made changes to the default thickbox size (still 600x600)

- I tried switching back to the default prestashop theme, but the same issue persists, so it's not theme related.

 

Can anybody help me? Zoom images showing up smaller than the product image itself makes no sense.

 

I am using Prestashop 1.4.7.0.

 

Thanks for your help!

 

Michelle

[CartExpert.net]

Hi,

 

The reason is: the images you have uploaded are smaller than the thickbox size is (600x600). In this case PrestaShop will not resize the images, but give them a 'frame' and place the image in the center.

 

The solution: upload the images again, having the size at least 600x600.

[lettersets]

Hi CartExpert.net,

 

Thanks for your reply. I looked into it and indeed the smaller images are given a frame making them 600x600. However, when I click on an image to enlarge it, it appears that the pop up window resizes the 600x600 to a smaller one (my guess is 400-500px wide) causing the original, smaller, image to be smaller than the image shown on the product page itself. How do I fix this? I would prefer to make the thickbox image smaller, because if the pop up window gets bigger it won't fit on the screen.

 

Thanks for your help,

 

Michelle

[CartExpert.net]

Hi Michelle,

 

The pop-up size is calculated according to the screen resolution.

 

If you want it to show the images in 600x600 you will need to edit the javascript code.

[lettersets]

Thanks for your reply, CartExpert. Any suggestions on where to look? I've had a look at product.js but it's not quite clear to me which part I would need to edit.

 

I would like it to leave the image size alone, if the pop up window is too small I'd like it to crop the image instead of resize it.

Alternatively, I could also set the thickbox image to 500x500, right?

[Bazze]

Your original image is small which will cause PrestaShop to add some empty space around your image, as mentioned earlier. A smaller thumbnail will get less empty space around it while a bigger image will get more empty space around it -- that's kinda obvious. So when displaying the bigger thumbnail, but not the full size of the bigger thumbnail, it will look smaller.

 

To fix this, I wouldn't go into the JavaScript code or any other code, because there aren't any coding issues. The issue is that the original picture is too small. So you should rather open up the original picture in Photoshop (or other likewise software) and enlarge the image, and then upload it to the product.

[CartExpert.net]

Thanks for your reply, CartExpert. Any suggestions on where to look? I've had a look at product.js but it's not quite clear to me which part I would need to edit.

 

I would like it to leave the image size alone, if the pop up window is too small I'd like it to crop the image instead of resize it.

Alternatively, I could also set the thickbox image to 500x500, right?

 

You could set some of the popup's style. Like the margin. If you reduce the margin the image will be displayed in a bigger format.

[CartExpert.net]

Your original image is small which will cause PrestaShop to add some empty space around your image, as mentioned earlier. A smaller thumbnail will get less empty space around it while a bigger image will get more empty space around it -- that's kinda obvious. So when displaying the bigger thumbnail, but not the full size of the bigger thumbnail, it will look smaller.

 

To fix this, I wouldn't go into the JavaScript code or any other code, because there aren't any coding issues. The issue is that the original picture is too small. So you should rather open up the original picture in Photoshop (or other likewise software) and enlarge the image, and then upload it to the product.

 

No one said there is a coding issue, but the image size is calculated in the function of the margin set in a Javascript file.

If she resizes the images in Photoshop they will loose quality. Especially because she needs to enlarge them at least by 300%

[Bazze]

No one said there is a coding issue, but the image size is calculated in the function of the margin set in a Javascript file.

If she resizes the images in Photoshop they will loose quality. Especially because she needs to enlarge them at least by 300%

 

No, but it doesn't make sense to me to change the code just because there is an issue on one or two products, because it might have a bad affect on all the other products already displaying correct. There is no need to enlarge it that much, just a little bit so it displays a little bit bigger in the thickbox than it does now.

[CartExpert.net]

It will not have bad affect.

[lettersets]

Thanks for your help guys,

 

I considered making the images bigger in Photoshop, and will certainly do that for my new products. However, I am transferring to Prestashop from a different webshop and have about 200 images that are all size 113x162px so would prefer a method that requires less work, instead of editing them all manually.

 

Changing the margins of the pop-up's style therefore seems like a better option at this time. CartExpert, do you know in which file I should look for them?

 

Michelle

[CartExpert.net]

Hi Michelle,

 

You can go for the image resize if you want to, but you will lose quality. For resizing we would recommend IrfanView, it can automatically resize images.

 

The javascript file is js/jquery/jquery.fancybox-1.3.4.js You can modify other settings too there. Scroll down to the end of the file.

[lettersets]

I played around with it for a bit. What ended up being the best option was changing the thickbox image size in BO (Preferences > Images > Thickbox) to 500px x 500px and then regenerating the thumbnails.

 

That filled the original, smaller, image up with a background to make an image size 500x500 that fits in the pop up window without being resized (and the image looking smaller).

 

Thanks for your help, I will now mark this topic as solved.

[CartExpert.net]

Happy we could help.

[lettersets]

Can't find how to change the subject title, but it's solved :-)

[CartExpert.net]

Edit your first post with the full editor and you can change the title.