marty.net 1001 Postcards Love Love Love Meep Meep ZenZodiac DailyQuotation

YOU ARE HERE:
Auto Resizing Product Page Image

HOME

CPSHOP|

|

|

EMAIL MARTY
  marty.net message board
  « Auto Resizing Product Page Image »
Welcome, Guest. Please Login or Register.
12/15/17 at 21:30:59
Home Help Search Login Register
   marty.net message board
   About cpshop
   Customization Help
   Auto Resizing Product Page Image
(Moderator: Marty)
Pages: 1 2 » Reply Notify of replies Send the topic Print 
   Author  Topic: Auto Resizing Product Page Image  (Read 1629 times)
hazeleyes7
Gold Dragon
****

Gender: female
Posts: 212



Labs Rock!
   

WWW E-Mail
Auto Resizing Product Page Image
« on: 11/21/11 at 14:39:15 »
Reply with quote Modify message

The product image on the product page is breaking my template. Is there any way to add a rule that uses a smaller product image on this page automatically?

Example:
http://www.8pawsup.com/cgi-bin/store/cpshop.cgi/labradorgifts.dakotasden-339220532+labrador-xing-dark-t-shirt.html
Logged

https://shannonksteffen.com
http://www.dogwiregifts.com
http://www.8pawsup.com
http://www.angelcove.us
http://www.catwiregifts.com
brattytees
Gold Dragon
****

Posts: 439



ack!
   

Re: Auto Resizing Product Page Image
« Reply #1 on: 11/21/11 at 20:47:47 »
Reply with quote Modify message

I just posted about this here.
Logged
Hex Angel - Patrick
Gold Dragon
****

Posts: 500



Our nature lies in movement; complete calm is death.
   

WWW
Re: Auto Resizing Product Page Image
« Reply #2 on: 11/21/11 at 20:48:31 »
Reply with quote Modify message

Hey there Hazel,

The URL for cpshop product images always looks like:


Code:
http://images2.cpcache.com/product/339220532v3_350x350_Front_Color-MilitaryGreen.jpg


Here, _350X350_ specifies the image size.

So, to resize a product image, all you need to do is change that to something else, say, _240X240_ -- which is what the HTML table in your product pages is setup for.

Fortunately, that's the kind of thing the cpshop image file does well. add this line to cpshop.cgi.images and all should be fine.


*||||_350X350_||||_240X240_

That does leave the question open as to why the cafepress and cpshop are serving up such huge product images?  
Logged

CPSHOP
www.PeaceAndLoveShop.com Namaste
BLOG
www.TheNomadicSpirit.com Inspired by travel
www.GodBeautyPerfectionLove.com Inspired by spirit
www.MyMuseMoviesMusicAndBooks.com Inspired by the arts
brattytees
Gold Dragon
****

Posts: 439



ack!
   

Re: Auto Resizing Product Page Image
« Reply #3 on: 11/21/11 at 20:56:44 »
Reply with quote Modify message

Hex, that will change the size of the image, but CP has CSS height 350px; inline in the IMG element, so it's still going to stretch it out, no? I don't use the cpshop images file, that would just be a bunch more files I'd have to keep up with, I try to keep as much in one place as I can, so I don't know if you can override inline CSS with the images file or not.
Logged
Hex Angel - Patrick
Gold Dragon
****

Posts: 500



Our nature lies in movement; complete calm is death.
   

WWW
Re: Auto Resizing Product Page Image
« Reply #4 on: 11/21/11 at 21:14:20 »
Reply with quote Modify message

yeah, I'm looking at that.

I don't tend to use the image file much, either.

I usually just do string replacements directly from cpshop.cgi.

I'll be back in a minute... or a few...
Logged

CPSHOP
www.PeaceAndLoveShop.com Namaste
BLOG
www.TheNomadicSpirit.com Inspired by travel
www.GodBeautyPerfectionLove.com Inspired by spirit
www.MyMuseMoviesMusicAndBooks.com Inspired by the arts
Hex Angel - Patrick
Gold Dragon
****

Posts: 500



Our nature lies in movement; complete calm is death.
   

WWW
Re: Auto Resizing Product Page Image
« Reply #5 on: 11/21/11 at 21:17:59 »
Reply with quote Modify message

And I forgot about the rollovers... it's a tad more complex than resetting the image size on one image.
Logged

CPSHOP
www.PeaceAndLoveShop.com Namaste
BLOG
www.TheNomadicSpirit.com Inspired by travel
www.GodBeautyPerfectionLove.com Inspired by spirit
www.MyMuseMoviesMusicAndBooks.com Inspired by the arts
brattytees
Gold Dragon
****

Posts: 439



ack!
   

Re: Auto Resizing Product Page Image
« Reply #6 on: 11/21/11 at 21:43:27 »
Reply with quote Modify message

I forgot about the rollovers too. Darn!!!!
Logged
Hex Angel - Patrick
Gold Dragon
****

Posts: 500



Our nature lies in movement; complete calm is death.
   

WWW
Re: Auto Resizing Product Page Image
« Reply #7 on: 11/22/11 at 07:07:50 »
Reply with quote Modify message

I've been wondering why I haven't had this issue... and think I've discovered the reason.

My image file contains the following line:


Code:
*||||<div id='productAreaWidth'></div>||||


I vaguely recall putting that line in there when CP/cpshop changes broke my markup quite some time ago. So I used the image file to take it out.

What that line is doing in your code is sizing your product area to 635 pixels wide, and if the product area is >= 635px wide, then the CP inline Javascript sets the image size to 350, otherwise it defaults to 240.

So long as your product area is < 635px wide in your CSS/HTML, you should be fine once the div is removed.

Cheers,

Hex.
« Last Edit: 11/22/11 at 07:09:23 by Hex Angel - Patrick » Logged

CPSHOP
www.PeaceAndLoveShop.com Namaste
BLOG
www.TheNomadicSpirit.com Inspired by travel
www.GodBeautyPerfectionLove.com Inspired by spirit
www.MyMuseMoviesMusicAndBooks.com Inspired by the arts
brattytees
Gold Dragon
****

Posts: 439



ack!
   

Re: Auto Resizing Product Page Image
« Reply #8 on: 11/22/11 at 15:59:10 »
Reply with quote Modify message


on 11/22/11 at 07:07:50, Hex Angel - Patrick wrote:
So long as your product area is < 635px wide in your CSS/HTML, you should be fine once the div is removed.

That's true, and I stress, IF and only if your actual page dimensions keep the productArea table constrained to under 635px. If it's going to be wider than 635 it doesn't matter if that productAreaWidth div is there or not for the most part.

There's more detail to all this at the link I posted above.
« Last Edit: 11/22/11 at 16:00:00 by brattytees » Logged
Hex Angel - Patrick
Gold Dragon
****

Posts: 500



Our nature lies in movement; complete calm is death.
   

WWW
Re: Auto Resizing Product Page Image
« Reply #9 on: 11/22/11 at 20:28:50 »
Reply with quote Modify message

Yep... won't work for you but I think Hazel's product area is under 635px wide, so it'd work for her.
Logged

CPSHOP
www.PeaceAndLoveShop.com Namaste
BLOG
www.TheNomadicSpirit.com Inspired by travel
www.GodBeautyPerfectionLove.com Inspired by spirit
www.MyMuseMoviesMusicAndBooks.com Inspired by the arts
hazeleyes7
Gold Dragon
****

Gender: female
Posts: 212



Labs Rock!
   

WWW E-Mail
Re: Auto Resizing Product Page Image
« Reply #10 on: 11/29/11 at 16:29:50 »
Reply with quote Modify message

Okay - I totally lost you guys. Sorry.  

What should I stick where? (I already have a few ideas of what I'd like to stick where for CP. LOL)

Thanks much!
Logged

https://shannonksteffen.com
http://www.dogwiregifts.com
http://www.8pawsup.com
http://www.angelcove.us
http://www.catwiregifts.com
hazeleyes7
Gold Dragon
****

Gender: female
Posts: 212



Labs Rock!
   

WWW E-Mail
Re: Auto Resizing Product Page Image
« Reply #11 on: 11/29/11 at 17:09:02 »
Reply with quote Modify message

Update: It worked like a charm except for the rollovers are now all funky and still have the large image. Anything else I should do? Is there another image <div> that needs to be updated?
Logged

https://shannonksteffen.com
http://www.dogwiregifts.com
http://www.8pawsup.com
http://www.angelcove.us
http://www.catwiregifts.com
Hex Angel - Patrick
Gold Dragon
****

Posts: 500



Our nature lies in movement; complete calm is death.
   

WWW
Re: Auto Resizing Product Page Image
« Reply #12 on: 11/29/11 at 17:52:43 »
Reply with quote Modify message

Hmmmm.... that's unfortunate, and unexpected.

I'm not sure what else to try, except to follow the other thread Bratty links to above, and see if something there doesn't work for you.
Logged

CPSHOP
www.PeaceAndLoveShop.com Namaste
BLOG
www.TheNomadicSpirit.com Inspired by travel
www.GodBeautyPerfectionLove.com Inspired by spirit
www.MyMuseMoviesMusicAndBooks.com Inspired by the arts
brattytees
Gold Dragon
****

Posts: 439



ack!
   

Re: Auto Resizing Product Page Image
« Reply #13 on: 11/29/11 at 18:06:48 »
Reply with quote Modify message

Yeah, that sux. It's weird that you and Hex are doing the same thing and his rollovers are fine. Did you try clearing the cache? I have no idea anymore what's stored in there, but maybe the 350 values are and that's throwing it off. I'd try that first, then maybe that line of JS Hex posted in the other thread to force the images to 240, although since your productArea is < 635 it shouldn't matter, the images should be set to 240. I'm not sure if you can accomplish that with the images file though since I don't use it, but it can't hurt to try.
Logged
brattytees
Gold Dragon
****

Posts: 439



ack!
   

Re: Auto Resizing Product Page Image
« Reply #14 on: 11/29/11 at 18:10:14 »
Reply with quote Modify message

This is what I'm talking about, maybe you can make a variation of it work in your images file?


Code:
$content =~ s/var size = \(pdpAreaWidth >= 635\) \? 350 : 240/var size = 240/;
Logged
Pages: 1 2 » Reply Notify of replies Send the topic Print 
Jump to:


marty.net message board (http://www.marty.net/cgi/marty/board/messageboard)

Powered by YaBB 1 Gold - Release (Yet Another Bulletin Board)
Copyright 2000-2001, X-Null. All Rights Reserved.