HOW-TO: Image Preparation

DrByte:

yes and yes

you can use .gif as long as ALL your images are .gif 's
Thanks Doc
What I tryed and it works like a charm is to setup the folders like my previous post and then I set all the image sizes in admin/configuration/images to blank. I process all my photos in photoshop anyway so I make the various sizes there. The advantage I see in this method is I can use landscape or portrait for products.

Thanks again
Roundy

This is a bug report and could possibly help people having trouble. I was having problems with images of multiple sizes as well. I had uploaded the images like so:

images/products/(publisher)/jpgs/(modelnumber).jpg
images/medium/products/(publisher)/jpgs/(modelnumber)_MED.jpg
images/large/products/(publisher)/jpgs/(modelnumber)_LRG.jpg

The images in images/products were the only ones being used by Zen Cart, regardless of the situation. I could not for the life of me figure out why, until I looked inside:

includes/modules/pages/product_info/main_template_vars_images.php

and found that, on line 25, ALL occurances of the extension, INCLUDING THE PERIOD, WHICH HAS A SPECIAL MEANING IN REGULAR EXPRESSIONS, are removed in the ereg_replace function call, meaning Zen Cart thought the medium image filename was:

images/medium/products/(publisher)s/(modelnumber)_MED.jpg

Note that not only did the three letters 'jpg' in the path get removed, but also the slash immediately preceding the 'j', because the period in the extension was matching the slash.

As a quick fix, I appended the following:

. '$'

to the first parameter of the ereg_replace call, making it only match the extension at the end of the filename string.

From a quick grep I just did, I found 25 instances of this ereg_replace mistake.

grep -r 'ereg_replace($products_image_extention' includes/*

-Don

Ah. I see there's already a topic about this bug in the Zen Cart Bug Reports forum.

http://www.zen-cart.com/modules/ipb/index....showtopic=17552

-Don

Nice tutorial Ryk for those unfamiliar with how to properly prepare images. Another little trick that has been mentioned here before is to only set either the hieght or width in the admin but not both. This will prevent images from being distorted disproportionally. Example: Set the thumbnail width to 100px and leave the height blank in admin. All your thumbnails will all be the same width and the height will be reduced proportional to the width.

Hi there,

Thanks for all this interesting info about images!

I'm pulling my hair out trying to figure out a simple thing. I am trying get have images in my product info page and also on the first (main) page.

I am doing the downloading as in the admin/products page, but the images just don't show.

I've gone to the Configure/images page in and changed the height to "0" and allow for proportonal images on products and categories.

And, the images still don't show.

The images are all jpgs too, and when I look at my server, the images are siting in the www/store/images area, which I think they should be.

Can any help!?

Thanks,
Steve ::frust

I was hoping for some help here and have been waiting for a couple of weeks. I'm surprised no one has written.

Please help!

Thanks

I'm not too sure exactly what your problem is ... do you mean you just want an image to show up on the front page as part of the general description of the site, or something else?

If the above, then you simply place a link to the relevant image in the text by using the define pages editor to modify your main_page.

Perhaps a url where we could look at your problem would help.

steventemplar and me seems to have the same problem.

When I first moved to ZC from OSC I made sure that the images worked as they were expected. I added a few test products and uploaded the images for them. Everything worked.

Then I began my daunting project of migrating a webshops entire database to ZC. After many daunting hours the migration were done and I had 13 000 new products with correct values in the database coming with ZC. But.

The product image won't show. No matter what. Only way to get them to show up is to add a product manually and I will NOT add 13 000+ products manually just to get the pictures to show up.

Please assist. (Yes. I've triplechecked so the right value is in the database, the images exist, world got read/access-rights to the files and so on.)

url?

Great info, this has helped so much in getting my images the right size

My thumbnail shows the right size 125x125
My Product page shows the right size 250x250

But......

Larger image (popup window) shows 125x125 looking at the jeg in the image folder not the large folder

I have played with java script which nicely resized the popup window but not the image.

Help :huh: !!!!!!

Check that the image IS in the large folder, and check that the name is the same as that of the small; if you have not changed the default suffix ie _LRG, make sure you actually have the suffix!

Otherwise, please supply a url so we can take a look.

PS. Some may wonder why we keep asking for urls...well, apart from the old adage that "a picture paints a thousand words" there is a LOT of information we can gather by the use of right click, View Source and, when using Firefox as the browser, the Web Developer Toolkit.

So, anything that is wrong visually or in your cart's behaviour - do supply a URL if you want help.

Ryk:

Check that the image IS in the large folder, and check that the name is the same as that of the small; if you have not changed the default suffix ie _LRG, make sure you actually have the suffix!

Otherwise, please supply a url so we can take a look.
THank you so much for the quick reply, I sincerely apologize for not replying sooner. I was going to include a URL but had an ERROR_DB_NOT_FOUND this was followed by ERROR_PLEASE_REMOVE_COMPONENT_BETWEEN_DESK_AND_CHAIR.

I ended up uninstalling and reinstalling Zen Cart and ta da no problems. I do think is was in the way I named the files - no underscores between words.

And I have a update to my problem. With good help from Ryk i made sure there were nothing wrong with ZenCart. Instead it was my migrated DB that had some error in it that caused the whole issue.

Now that I've fixed the DB and regenerated the image url's everything works as intended.

Thanks Ryk :).

Am I missing something here? I am just starting up Zen-Cart and the way I upload my pictures is by using the admin product add new product and point to the picture using the browse function. It seems that when I choose one picture ZC takes care of the rest and they show up automatically. Should I be uploading things differenctly? And if I do upload them differently how do I link a specifiic product with a specific picture?

I am trying to broaden my knowledge and use of ZC. Thanks.

Jason

You will want to read up on the Zen Cart Product Images in the FAQs or as a convenient search try looking for fred.jpg

The Admin has you add the Products base image name (small image) ... from this you can FTP to the site Medium, Large and Additional images, small and Large ...

These are all auto loading based on the base image name for the product ...

Just to expand a little...

When you use the standard method you are only uploading the one image AS IT IS from your hard drive. ZenCart will display that image at the dimensions you declare in admin>configuration>images for small or medium, but it will NOT resize the image.

So, if the only image you upload is 600x480 pixels with a file size of 40KB, then, although your medium and small images will display at your selected dimensions, the file size wil remain at 40KB.

Conversely, if your original image is 100x100 pixels with a file size of 3KB, your medium image will look dreadful (although the page will load like lightning!!) because ZC will stretch it to fit the dimensions set, and your large image will not be large.

Therefore, to make everything work properly using the ZC core system, you need to make 3 copies of the image as discussed at the beginning of this topic; the small one is uploaded via admin>product etc and becomes the base image; you then FTP the medium and large to their respective folders.

Alternatively, you install the Image-Handler mod which allows you to upload any image at the Product Entry stage and it will automatically create the 3 copies for you at your set dimensions and at the correct file size, AND put them in the correct folders/directories!::tup

THIS is why we would like to see the functionality of Image-Handler incorporated into the core files.

Note that with I-H you must use an image at least as large as your largest image for this to work properly. (A smaller one would still be stretched and therefore look dreadful)

Thanks Ryk,

That was the explanation I was looking for. Now I understand that if I take my 60K images and only use them for my Large image, and make a small image for the overview pages where many images are displayed then that page will load quicker. As is, I assume that it is loading all my small images sized 60k and displaying them smaller.

Thank you!.

I have the image handler. Iunderstand that I have to upload my largest image.

Is this image to be my "default image" or my "large" image. Because the menu says you must have a default image first, so the previous tutorials are a little confusing.

Also,
Are the small images, new products, featured products and catalog images all the same size? Or is this where you set your preferences? because I noticed that the default dimensions were the same for all of these.

Thanks.
Sandra

https://www.debutanteclothing.com

1. Default (NB the tutorial was written before the arrival of I-H)

2. For best results, set all the listing and small image settings to the same; the medium image is the one displayed on your product info page.

Note that I-H will create your images according to the settings you have made in configuration>images for small, medium and large.