Jump to content
  • Checkout
  • Login
  • Get in touch

osCommerce

The e-commerce.

[HELP REQ] Image Resize in 2.3.1


Nigel_S

Recommended Posts

Here's my problem...

 

I have a site 2.2RC site that uses both portrait and landscape images and, having set only a max height in Configuration/Images they scale perfectly (max width is not set).

 

In 2.3.1 if I try the same thing (i.e. set either width, or height but not both), images do not scale at all - they show full size. This is fine for the 'enlarged' image but no good for things like the Product Description image etc.

 

The only way to shrink them is to set both width and height.

 

This would be perfect if it not for the fact that not all my images are the same size and neither are they all portrait or landscape. They are a mix.

 

So my images end up squashed either vertically or horizontally.

 

So, how do I get properly re-sized images in osC 2.3.1??

 

Any ideas/suggestions would be much appreciated.

 

Thanks in anticipation of your help.

 

Nige.

Link to comment
Share on other sites

Nigel,

 

The osc 2.3.1 developers made the SILLY mistake of hard coding the image sizes into the product_info.php file. This was a complete hack of SPOOKS Multi Image add on with Fancy Pop Ups from v2.2 RC2a. However, since it is done, look for this code in the product_info.php and make changes as needed.

 

 

<script type="text/javascript">

$('#piGal ul').bxGallery({

maxwidth: 300,

maxheight: 200,

thumbwidth: <?php echo (($pi_counter > 1) ? '75' : '0'); ?>,

thumbcontainer: 300,

load_image: 'ext/jquery/bxGallery/spinner.gif'

});

</script>

 

 

Chris

Link to comment
Share on other sites

Yes images can be re-sized. But my issue is with having clearer and better looking images. They are somewhat distorted, regardless how I change the the code in admin -> images or product_info.php as I have posted here.

Link to comment
Share on other sites

Nigel,

 

The osc 2.3.1 developers made the SILLY mistake of hard coding the image sizes into the product_info.php file. This was a complete hack of SPOOKS Multi Image add on with Fancy Pop Ups from v2.2 RC2a. However, since it is done, look for this code in the product_info.php and make changes as needed.

 

 

<script type="text/javascript">

$('#piGal ul').bxGallery({

maxwidth: 300,

maxheight: 200,

thumbwidth: <?php echo (($pi_counter > 1) ? '75' : '0'); ?>,

thumbcontainer: 300,

load_image: 'ext/jquery/bxGallery/spinner.gif'

});

</script>

 

 

Chris

 

Hi Chris,

 

Thanks for this... it helped greatly! At least the images on the product_info page look OK - now all I've got to do is get the thumbnails on the products listing looking the same!

 

Cheers!

 

Nige.

Link to comment
Share on other sites

  • 1 month later...

Nigel,

 

The osc 2.3.1 developers made the SILLY mistake of hard coding the image sizes into the product_info.php file. This was a complete hack of SPOOKS Multi Image add on with Fancy Pop Ups from v2.2 RC2a. However, since it is done, look for this code in the product_info.php and make changes as needed.

 

 

<script type="text/javascript">

$('#piGal ul').bxGallery({

maxwidth: 300,

maxheight: 200,

thumbwidth: <?php echo (($pi_counter > 1) ? '75' : '0'); ?>,

thumbcontainer: 300,

load_image: 'ext/jquery/bxGallery/spinner.gif'

});

</script>

 

 

Chris

 

I have just started playing with 3.2 and this one still has me stumped. I hate to think I need to shrink all my images first and upload 2 different sizes.

My problem is my product image on the product info page is full size. I edited the code Chris mentioned. I tried every number in the entire block and my image is still huge:

<script type="text/javascript">
$('#piGal ul').bxGallery({
 maxwidth: 30,
 maxheight: 20,
 thumbwidth: <?php echo (($pi_counter > 1) ? '5' : '0'); ?>,
 thumbcontainer: 30,
 load_image: 'ext/jquery/bxGallery/spinner.gif'
});
</script>

What have I done wrong?

 

Tim

Link to comment
Share on other sites

I have just started playing with 3.2 and this one still has me stumped. I hate to think I need to shrink all my images first and upload 2 different sizes.

My problem is my product image on the product info page is full size. I edited the code Chris mentioned. I tried every number in the entire block and my image is still huge:

<script type="text/javascript">
$('#piGal ul').bxGallery({
 maxwidth: 30,
 maxheight: 20,
 thumbwidth: <?php echo (($pi_counter > 1) ? '5' : '0'); ?>,
 thumbcontainer: 30,
 load_image: 'ext/jquery/bxGallery/spinner.gif'
});
</script>

What have I done wrong?

 

Tim

Halfway fixed. I only had one image uploaded so the code specified did not apply. Once I uploaded a large image the code changes worked.

 

I downloaded irfanview and batch resized all my images to 80 wide. Then I batch renamed all my images to **L.jpg

Now I just need a way to batch upload them to the proper db table. Evidently the recent update to easy populate is not fully 3.2 ready.

 

Tim

 

ps. This has been an extraordinary change in the way I do my sites. :) I am getting too old to learn all this over again.

Link to comment
Share on other sites

Halfway fixed. I only had one image uploaded so the code specified did not apply. Once I uploaded a large image the code changes worked.

 

I downloaded irfanview and batch resized all my images to 80 wide. Then I batch renamed all my images to **L.jpg

Now I just need a way to batch upload them to the proper db table. Evidently the recent update to easy populate is not fully 3.2 ready.

 

Tim

 

ps. This has been an extraordinary change in the way I do my sites. :) I am getting too old to learn all this over again.

Oscthumb works for 2.3.1 although it has a few undefined variables in the includes/classes/phpthumb.php that needs fixing, but easy to do.

Link to comment
Share on other sites

  • 3 weeks later...

Ok, for those who run into this issue you need to look at this differently than previous versions of osC. The MAIN image will be used for your listings, boxes.. any place a small image will be used. (Even if your image is 800x800).

 

Now, if that is the only image you use then that will be the default image for your product page of said image and display at whatever size that is - which could cause some problems if it's too large.

 

Now if you put that same image as your 1st large image (Same one you used as MAIN) that will be displayed on your product page as whatever size up to 300x200.. if beyond that it re-sizes it to that. But when you click on it for the fancybox it will then expand to it's true size.

 

When using Main + (any #)Large Images -- the Main image will not display on your product info page.

Say you put a red image in Main and Blue in 1st Large Green in 2nd Large. Listing will show a red image, but clicking on it and going to Product page will show the Blue Image (1st Large) as the product image and the Green (2nd and subsequent) in boxes below - the red will never appear.

 

Last note - if you only put images in the large image and none in main then there will be no pics available for product listing, boxes (such as: bestsellers, reviews, etc.).

 

Hope this helps someone because I was playing for awhile trying to figure out why the image was not re-sizing like it used to.

 

Nutshell - if you want one image for a product and that image is over 300x200.. upload it to BOTH Main and 1st Large Image.

Link to comment
Share on other sites

  • 2 months later...

Hi all,

 

Just had to migrate a shop over from 2.2 to 2.3.1 and had a similar issue with the images in product info being too large.

As above mentioned having the main and large image the same will fix your problem. My problem was, I have a lot of products I don't want to reupload for.

A quick check of the sql database and a simple query solved my problem.

 

(In phpmyadmin) With an empty products_images table run this query and it will add the data as if you've uploaded the image twice saving hours of time!

 

INSERT INTO `products_images` (`products_id`, `image`) SELECT `products_id`, `products_image` FROM `products`

Link to comment
Share on other sites

  • 4 weeks later...

I test and for the jquery 1.6, there is a problem with fancybox or bxgallery.

 

undefined image appear above the thumbail


Regards
-----------------------------------------
Loïc

Contact me by skype for business
Contact me @gyakutsuki for an answer on the forum

 

Link to comment
Share on other sites

  • 4 weeks later...

WOW! you are genius man!

 

After spending the entire day here with others contributions on how to resize the product_info photos and getting no where. I do a search, find this threat, tried some of the previous suggestions before yours, still nothing works. Tried your query in an empty products_images.

 

I could KISS YOU!!!!!!!!

 

Very frustrations for someone like me that knows absolutely NADA about all this coding.

 

I have become proficient in copy and pasting though. :P

 

 

Now, if I could just get the Fancybox contribution to work for my v2.3.1 install, I would be in heaven!

 

 

 

Hi all,

 

Just had to migrate a shop over from 2.2 to 2.3.1 and had a similar issue with the images in product info being too large.

As above mentioned having the main and large image the same will fix your problem. My problem was, I have a lot of products I don't want to reupload for.

A quick check of the sql database and a simple query solved my problem.

 

(In phpmyadmin) With an empty products_images table run this query and it will add the data as if you've uploaded the image twice saving hours of time!

 

INSERT INTO `products_images` (`products_id`, `image`) SELECT `products_id`, `products_image` FROM `products`

Link to comment
Share on other sites

Oh and I meant I need the Fancybox for multiple images contribution to work for me. Spent all day on it and just can't get it to work at all even with the new Migration contribution for v2.3.1

Link to comment
Share on other sites

  • 2 weeks later...

This is why:

 

http://api.jquery.com/attr/

 

The problem is that bxgallery with jquery 1.6 returns undefined on the

"catpion" var.

 

The attr() method should be changed with the prop() method.

 

I had the "undefined" issue as above and after rooting around in the files I made these changes to the jquery.bxGallery.1.1.min.js file.

 

That cleared up the issue, but I am not a coder and hope I got the correct file to modify. Can someone verify?

I am not a professional webmaster or PHP coder by background or training but I will try to help as best I can.

I remember what it was like when I first started with osC. It can be overwhelming.

However, I strongly recommend considering hiring a professional for extensive site modifications, site cleaning, etc.

There are several good pros here on osCommerce. Look around, you'll figure out who they are.

Link to comment
Share on other sites

  • 2 months later...

I had the "undefined" issue as above and after rooting around in the files I made these changes to the jquery.bxGallery.1.1.min.js file.

 

That cleared up the issue, but I am not a coder and hope I got the correct file to modify. Can someone verify?

 

Opsss sorry for the late response, i have posted the bxgallery patch on github at this address: bxgallery "undefined" patch

Link to comment
Share on other sites

  • 1 month later...
  • 4 months later...

Nigel,

 

The osc 2.3.1 developers made the SILLY mistake of hard coding the image sizes into the product_info.php file. This was a complete hack of SPOOKS Multi Image add on with Fancy Pop Ups from v2.2 RC2a. However, since it is done, look for this code in the product_info.php and make changes as needed.

 

 

<script type="text/javascript">

$('#piGal ul').bxGallery({

maxwidth: 300,

maxheight: 200,

thumbwidth: <?php echo (($pi_counter > 1) ? '75' : '0'); ?>,

thumbcontainer: 300,

load_image: 'ext/jquery/bxGallery/spinner.gif'

});

</script>

 

 

Chris

 

Very helpful thank you.

:thumbsup:

Link to comment
Share on other sites

  • 1 month later...
  • 4 weeks later...

As with Xi above, I am also new, my images look fine as I worked out a regime to size them that forced them to look ok, however when I add text with the first image (called "large" not "main") the text appears halfway down the page and not below the image as it should. I checked the code in product_info and using dreamwever live code can see the issue, just not sure how to fix it!

 

Any help appreciated. The caption var mentioned by Steve sounds like it could be the issue?

 

Thanks J.

Link to comment
Share on other sites

  • 3 weeks later...

HI,

 

I made the following change and the image size is still "cropped". Any ideas what i am doing wrong? I have images i have are both portrait and landscape, but its the portrait ones that are cropped.

 

any advice appreciated ... thanks

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...