[Resolved] Woocommerce center product name related products product image size shop page

Home Forums Support [Resolved] Woocommerce center product name related products product image size shop page

Home Forums Support Woocommerce center product name related products product image size shop page

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #583171
    Joe

    Hi,

    I have two Woocommerce problems.

    First, on a single product page, the product names under the related products are left aligned. I want to center them. Is there some CSS that can do this? I can drop it into Simple CSS.

    I am fighting with this second problem. On category pages as well as on a shop page set for products, a product image picture I am using on one product is pushing the product name, price and add to cart button downward slightly. This creates a misalignment with products in the same row in the on a category page or a shop page set for products. How do I fix this? What size product image picture would I have to set to avoid this visual misalignment and where would I set the size? Where would I find the settings to experiment with setting the side of the product image picture. Could it be something else?

    Thanks and look forward to hearing from you.

    Joe

    GeneratePress 2.1.2
    GP Premium 1.6.2
    #583296
    David
    Staff
    Customer Support

    Hi Joe,

    this CSS for aligning the related and upsell products:

    .woocommerce .related ul.products li.product, 
    .woocommerce .up-sells ul.products li.product {
        text-align: center;
    }

    regarding products images, the best thing is to keep them all the same aspect ratio. I personally keep them all square, and add clear space around those odd sized images.

    #583905
    Joe

    Hi David,

    The CSS for aligning the related and upsell products worked right away. Thanks!

    Regarding keeping the products images all at the same aspect ratio, where to I go to accomplish that? I can do it in the WordPress Media Library – I went there and changed the aspect ration to 1:1 for thumbnails and still got misalignment. I also went to GP > Woocommerce >product images – I set thumbnail cropping there to 1:1 and I still got the misalignment using thumbnail widths from 120 to 500. When I remove the product image, I get no misalignment. When I reload the product image with 1:1 aspect ratio, , the misalignment returns. What do you think?

    Joe

    #583954
    David
    Staff
    Customer Support

    Hi Joe, glad it worked.
    I size and crop my images before uploading to WordPress so they are all the same aspect ratio. You may want to recrop that particular image so it matches the others.

    As a note, any changes you make to WP or Woo thumbnail sizes will only take effect on new uploads. Existing media files won’t change, you would need to use the Regenerate Thumbnails plugin to update them. But i would advise if all but one of your images are good then put the thumbnail settings back to their original settings and just try to fix the problem one.

    #583982
    Joe

    Hi David,

    You are right. It is the particular photograph that is messed up.

    I loaded another picture that I changed the aspect ratio to 1:1 while I was loading it into the product page I have been complaining about. The new image in the old product page created no misalignment. So I will probably delete the corrupted product photograph,reload the original and recast the aspect ratio to 1:1.

    Thanks for giving me some perspective on this.

    Joe

    #583990
    David
    Staff
    Customer Support

    You’re welcome Joe glad you got it resolved

Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.