• Skip to main content
  • Skip to forum navigation

StudioPress

  • Shop for Themes
  • My StudioPress

Forum navigation

  • Home
  • General Genesis Discussions
  • StudioPress Themes
  • Genesis Blocks
    • Genesis Blocks
    • Genesis Custom Blocks
  • Retired Themes
  • FAQs
  • Forum Rules
  • Internationalization and Translations
  • Forum Bugs and Suggestions
  • Forum Log In

Are You Using The WordPress Block Editor?

Genesis now offers plugins that help you build better sites faster with the WordPress block editor (Gutenberg). Try the feature-rich free versions of each plugin for yourself!

Genesis Blocks Genesis Custom Blocks

woocommerce product image sizes not correct with Beautiful child theme

Welcome!

These forums are for general discussion on WordPress and Genesis. Official support for StudioPress themes is offered exclusively at My StudioPress. Responses in this forum are not guaranteed. Please note that this forum will require a new username, separate from the one used for My.StudioPress.

Log In
Register Lost Password

Community Forums › Forums › Archived Forums › General Discussion › woocommerce product image sizes not correct with Beautiful child theme

This topic is: not resolved

Tagged: Beautiful, child theme, product size, WooCommerce

  • This topic has 6 replies, 4 voices, and was last updated 10 years, 7 months ago by studio2017.
Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • September 16, 2014 at 1:07 am #124623
    studio2017
    Member

    Hi,
    We are new to Genesis and woocommerce. Previously we built our website using WordPress and a free theme. We recently purchased the Beautiful child theme from Genesis and installed the Genesis connect for woocommerce plugin. We are finding that the product images are displaying very BIG. We've changed the woocommerce/settings/product sizes of catalog image to 150, single product image to 250, thumbnails to 90, and regenerated thumbnails using the plugin 'regenerate thumbnails' but they are still displaying very big on the SHOP. See http://test.studio2017.com.au/?product=bridget-kennedy-phos-fate-series for an example. My amateur guess is that the child theme is overriding the settings in woocommerce. If this is the case, how do I get WordPress to point to the woocommerce product size settings? I've googled this but can't seem to find any help.
    thanks for your help.

    http://test.studio2017.com.au/?product=bridget-kennedy-phos-fate-series
    September 16, 2014 at 3:40 am #124626
    Blenderbox
    Member

    Your thumbnail sizes are fine, 250 the product image, and 150 the related products images, you can see that on the image attributes with browser element inspector.

    If you want the related products images smaller, you have to change the size of the

  • element because the images have 100% width.

    For example:

    .woocommerce .related ul li.product, .woocommerce .related ul.products li.product, .woocommerce .upsells.products ul li.product, .woocommerce .upsells.products ul.products li.product, .woocommerce-page .related ul li.product, .woocommerce-page .related ul.products li.product, .woocommerce-page .upsells.products ul li.product, .woocommerce-page .upsells.products ul.products li.product {
    width: 25%;
    }

    add this on your child theme style.css file.

September 17, 2014 at 1:19 am #124730
studio2017
Member

Hi thank you for your help Blenderbox.
I made the changes you suggested but it doesn't seem to have made any difference.

The images are still displaying larger than the thumbnails that were regenerated.

This seems to be the case for the single product image which is displaying larger than 250 which is the generated image size - they are all displaying as 346 wide. When I inspect the code by right clicking and selecting 'inspect element' it is saying that width is 100%. If I untick this box the single product displays correctly but still leaves an active 'mouse pointer hover area' of the original 100%. For example - http://test.studio2017.com.au/?product=julie-blyfield-earrings

The images in the 'SHOP' all seem to be displaying with a width of 159, even though the actual thumbnails are only 150. http://test.studio2017.com.au/?post_type=product

Another example is the shopping cart when an item is selected which is displaying it at 32px even though the thumbnail is 90px when the element is inspected. http://test.studio2017.com.au/?page_id=6452

I tried adding the code '!important' after the code you suggested but that didn't make a difference either. I've now removed that last bit of code.

Any other ideas?

September 17, 2014 at 4:39 am #124737
DTHkelly
Member

https://support.woothemes.com/hc/en-us/articles/202891608-WooCommerce-Image-Issues-Stretching-Distortion-and-Blur

http://77webstudio.com/fix-blurry-images-woocommerce-wordpress/

https://support.woothemes.com/hc/communities/public/questions/201683333-Blurred-images

http://docs.woothemes.com/document/using-the-appropriate-product-image-dimensions/

September 18, 2014 at 2:39 am #124870
studio2017
Member

hi Kellylise,
Thanks for the links.
They certainly helped with my understanding and removing the blurriness issue . However the Beautiful Theme is still displaying large images in the shop area. It seems that it renders the single image and related images at 346 and the catalogue images at 159 on the SHOP product list page.

Does anyone know how I can change the beautiful theme so that the related images and single image are not so massive and are rendered smaller? http://test.studio2017.com.au/?product=bridget-kennedy

September 29, 2014 at 7:39 am #126146
alistairmckenzie
Member

I have the same issue, I haven't got a fix as yet but think it is something to do with the latest version of woocommerce it doesn't seem compatible with Genesis Connect for woo commerce

October 6, 2014 at 11:49 pm #126963
studio2017
Member

Hi Alistair,
We are new to Genesis. Is this sort of compatibility bug generally fixed quite quickly? We went with Genesis because we thought they would be on top of all these things.

  • Author
    Posts
  • Viewing 7 posts - 1 through 7 (of 7 total)
    • The forum ‘General Discussion’ is closed to new topics and replies.

    CTA

    Ready to get started? Create a site or shop for themes.

    Create a site with WP EngineShop for Themes

    Footer

    StudioPress

    © 2025 WPEngine, Inc.

    Products
    • Create a Site with WP Engine
    • Shop for Themes
    • Theme Features
    • Get Started
    • Showcase
    Company
    • Brand Assets
    • Terms of Service
    • Accptable Usse Policy
    • Privacy Policy
    • Refund Policy
    • Contact Us
    Community
    • Find Developers
    • Forums
    • Facebook Group
    • #GenesisWP
    • Showcase
    Resources
    • StudioPress Blog
    • Help & Documentation
    • FAQs
    • Code Snippets
    • Affiliates
    Connect
    • StudioPress Live
    • StudioPress FM
    • Facebook
    • Twitter
    • Dribbble