[Support request] Inconsistently-sized images in WooCommerce from GP

Home Forums Support Inconsistently-sized images in WooCommerce from GP

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #1229079
    Ian

    I had initially thought this was an Elementor issue, but their tech support team has indicated the fault is with GP. (I could forward you their explanation if desired.)

    The easiest way for me to explain this problem is to have you follow these steps to view the issue in the website:

    Start here: https://bluebarnquiltco.com/fabric/
    Click on the AGF Pure Solids category.
    Look at the resulting page, noting that the colour blocks being displayed there are differently-sized – but they’re all made with graphic images of equal dimensions!
    Go back to https://bluebarnquiltco.com/fabric/ and this time click on the Jelly Rolls category.
    The source files of each of those three resulting graphics are the same dimensions, yet each is displayed at a different size!

    The Elementor widget that effectively generates both of these pages is Edit Product Categories. But what I’ve learned from Elementor is that the resulting page comes from GP.

    The obvious question is: How do I ensure all of the graphics appear as the same size?

    #1229174
    David
    Staff
    Customer Support

    Hi there,

    there isn’t room for 6 columns – if you add an item to the cart, the 6th column will overlap the right sidebar cart widget.

    Try reducing columns to 5 and reduce the Column Gap to 20px.

    Let me know.

    #1229211
    Ian

    So close, but not quite there yet…

    Your fix – which I applied at Customize > Layout > WooCommerce – definitely fixed the listing of the AGF Pure Solids items. Unfortunately, the Jelly Rolls display just as they did before – in three different sizes! Why this would apply to one of these and not another is a mystery to me – and that I hope you can help solve!

    #1229226
    David
    Staff
    Customer Support

    Aah – so thats because of the ‘long’ word ie. Pink/Orange/Yellow it cannot wrap to a new line so the Item container expands to accommodate it.

    Options:
    1. Edit the product title and introduce some spaces between colors.

    OR

    2. CSS Fix:

    .woocommerce ul.products li.product .woocommerce-LoopProduct-link h2 {
        word-break: break-word;
    }
    #1230512
    Ian

    Thanks for all of the help here, David. I ended up not using your code and editing some product names and making the font size of those products smaller.

    #1230861
    David
    Staff
    Customer Support

    I agree that is the better solution. Glad to be of help

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