Return to previous page

Re-sizing featured images? - by talonhead

This topic has 20 replies, 4 voices, and was last updated 8 years, 12 months ago ago by Eva Kemp

talonhead

Participant

February 24, 2016 at 10:40

Hey guys. Can the featured image be adjusted? I need it scaled down a bit and possibly in different proportions. I noticed that the theme takes the featured image size set in Woocommerce settings and scales them down from, for example, 570×750 to 360×474.

Thanks as always!

#114558 Copied Theme version: 1.5 WooCommerce version: 2.4.12

19 Answers

Eva Kemp

Participant

February 24, 2016 at 11:09

Hello,

Try to change settings in Woocommerce > Settings > Products > Display and deactivate hard crop option. Then regenerate thumbnails in Tools > Regen. thumbnails.

Regards,
Eva Kemp.

#114563 Copied

talonhead

Participant

February 24, 2016 at 11:14

I’d rather not go that route because the last time I used the tool of re-generating thumbnails, that totally messed with my media folder. Took forever to remove duplicate images and clean things up. IT also tends to re-generate thumbnails for the entire site…not just for products. I could be wrong. Besides, the scaling is what I’m most interested in….and the theme is what is scaling it as far as I can tell. Not Woocommerce.

#114568 Copied

Eva Kemp

Participant

February 24, 2016 at 12:41

Hello,

As you can see Woocommerce suggests to regenerate thumbnails after changing settings http://storage7.static.itmages.com/i/16/0224/h_1456314059_5511369_27dce9ba39.png .
Please specify what sizes you want to use for single product image.
May we regenerate thumbnails after making changes?

Regards,
Eva Kemp.

#114578 Copied

talonhead

Participant

February 24, 2016 at 12:50

I’m aware of what they say to do….and as mentioned previously, I’d rather not regenerate anything…unless you can guarantee it won’t affect my media folder with a slew of duplicated images.

Again, the theme is what is scaling it…not Woocommerce. I would like to change what your theme is scaling it to. That’s it. If you right-click and “view image info” on the page attached, you would see this a bit clearer on what I’m trying to convey. What image info will say are the same numbers that is set in Woocommerce BEFORE any scaling is applied by the theme.

Please, contact administrator
for this information.

#114580 Copied
Jack Richardson

Support staff

February 24, 2016 at 15:42
Hello,

Image sizes depend on page layout as well (Theme Options > E-Commerce > Single Product Page > Page Layout). Page content is divided into columns and if you want to change image size of the current layout you are using, add this code in Custom CSS fo desktop section:

.col-lg-4.col-md-5.col-sm-12.product-images { width: 28% !important; }

Set width value to your needs.

Best regards,
Jack Richardson.
#114620 Copied
talonhead

Participant

February 24, 2016 at 15:50

Thanks Jack…that works, but it messes with the responsiveness of the page. 🙁 Featured images as well as gallery images get REALLY small when adding that code and viewed on a mobile device. Proportions are correct…just scaled down bigtime on a mobile device.

#114621 Copied

Jack Richardson

Support staff

February 24, 2016 at 16:11

Hello,

I suppose you added the code in Global CSS section that’s why responsive style was affected. I’ve added it in Custom CSS fo desktop section as shown on the screenshot http://prntscr.com/a7d0lo
Please clear browser cache and check the page.

Best regards,
Jack Richardson.

#114625 Copied

talonhead

Participant

February 24, 2016 at 16:31

lol I feel dumb. Thanks for clearing that up for me. 🙂

One last thing, can you check the “#1 link” attached page and tell me why it doesn’t respond like link #2 attached? When minimizing the browser (FF) to the size of a mobile device, it gives me horizontal scroll bars with #1 link. The #2 link does not. Been pulling my hair out on this one.

Many thanks!

Please, contact administrator
for this information.

#114631 Copied
Eva Kemp

Participant

February 24, 2016 at 17:56
Hello,

I’ve added this code in CSS block of Visual Composer editor for the first product:

@media (max-width: 480px) {.row { overflow-x: hidden; }}

Please check it now.

Regards,
Eva Kemp.
#114643 Copied
talonhead

Participant

February 24, 2016 at 21:34

What are we talking about exactly? I don’t see any change on this one. But what is the code you sent supposed to do? And send me a screenshot of where you added the code to. Thank you!

#114704 Copied
Robert Hall

Participant

February 24, 2016 at 21:58
Hello,

Please try to add the following code in 8theme options->styling->custom css->global custom css.

.postid-132 .template-content{ overflow: hidden; }

Regards,
Robert Hall.
#114710 Copied
talonhead

Participant

February 25, 2016 at 01:49

Thanks Robert…but that only fixes the problem with that one page. Rather a band-aid really.

I’d rather figure out what’s going on to why one page would scale the images differently than the other. Exact same image sizes uploaded but the Link #1 does NOT give me the horizontal scroll bars when browser is sized to mobile because (from what I can tell) the gallery thumbnail images are scaled smaller. In this case, 73×86 whereas the other link (Link #2) scales gallery thumbnails to 90×106 for example. Why is this?

So if we can just have all my product pages scaled in the same manner as what Link #1 already does, then I’m sure we’ll nail this problem. I really don’t want to keep adding products at this point until it’s figured out.

I went ahead and removed the CSS code that you gave me for now.

Check out both links and see the differences in gallery thumbnail sizes.

Thanks!

Please, contact administrator
for this information.

#114721 Copied

Eva Kemp

Participant

February 25, 2016 at 11:34

Hello,

The problem is related to your WooSwipe gallery plugin.
Disable it and check single product page after that.
If you still want to use you need contact the plugin authors regarding your issue.

Regards,
Eva Kemp.

#114793 Copied

talonhead

Participant

February 25, 2016 at 11:40

I see. Well, we went this far with it…just thought I would ask since we were still on the subject. Wooswipe developer says it’s you guys…you say its Wooswipe. Caught in the middle here. Ugh.

Again as mentioned above, Eva, can you screenshot where you added this code?

@media (max-width: 480px) {.row {
overflow-x: hidden;
}}

#114794 Copied

Eva Kemp

Participant

February 25, 2016 at 11:46

Hello,

As I see the code is removed now.
I added it in product editor page:
http://storage7.static.itmages.com/i/16/0225/h_1456397162_8982707_56a8aea090.png

Please take our apologies but we don’t provide support for 3rd-party plugins.
Thank you for understanding.

Regards,
Eva Kemp.

#114797 Copied

talonhead

Participant

February 25, 2016 at 11:51

Interesting. What exactly was this code addition supposed to do? I don’t even think it was ultimately related to my problem.

And of course…why would you offer support on third party plugins? But again, I’m being told two different things here from two different developers…so can you blame me for asking? 🙂

#114798 Copied

Eva Kemp

Participant

February 25, 2016 at 11:57

Hello,

That code removes horizontal scroll on mobile.
Try to add it yourself and check.

Regards,
Eva Kemp.

#114803 Copied

talonhead

Participant

February 25, 2016 at 22:53

Yep…a good tool to use. I might call upon that snippet if I can’t get things figured out. Thanks again Eva!

Close it up.

#114958 Copied

Eva Kemp

Participant

February 26, 2016 at 09:30

Hello,

You’re welcome.

Regards,
Eva Kemp.

#115003 Copied
Viewing 20 results - 1 through 20 (of 20 total)