Latest update to Woocommerce has broken the layout of my site

  • Resolved smitchio

    (@smitchio)


    4 years, 4 months ago

    Hi there,

    Since updating to the latest Woocommerce, my site’s layout seems to be very broken. I initially thought it was a simple styling issue but I’ve checked (see further in the post) and it’s not that.

    Some of the issues:
    – Header: the header (usually a single strip at the top) is now repeated if there is an item in the Basket. It looks like the Basket is not positioned on top of the header, it’s within the header.

    – Shop: product items are not displaying correctly. On this page [ https://www.flaxandmallow.com/product-category/handmade-liberty-print/ ] the items are listed in a single column now with bullet points whereas before they were sat next each other in a grid layout.

    – Product item page: [ https://www.flaxandmallow.com/shop/handmade-liberty-print/padded-clothes-hangers-liberty-print/ and on another product page: https://www.flaxandmallow.com/shop/liberty-print-fabric/fm44/ ] The carousel of images is now in a long list and there is a product item appearing below the footer.

    – Basket: Unable to update the basket or remove an item from the basket on the Basket page. I can remove it from the Basket dropdown in the header.

    – there are many others but the above are the main ones.

    There is so much wrong with it visually, I thought perhaps it was the latest update to Storefront (I use a childtheme so the custom styles haven’t been written over) but now the more I look at it, the more I think it is Woocommerce.

    Things I have done so far:
    – used DiffMerged to check inconsistencies or differences in the Storefront theme folder using the live version and an older version but there are such slight differences that I don’t think it is that.
    – checked the console to see if any files are not loading or missing but all is fine.
    – checked the custom.css is still in the child theme and all good.

    This is beyond my WordPress knowledge so any advice is very gratefully received, thank you in advance.

    Sophie

    The page I need help with: [log in to see the link]

Viewing 5 replies - 1 through 5 (of 5 total)
  • Thread Starter smitchio

    (@smitchio)

    Update – I have reverted it back to before the update but if anyone has experienced anything similar, please do let me know as I will have to update it again at some point.
    thank you.

    Plugin Support Tseten a11n

    (@tibetanitech)

    Hi @smitchio,

    Thank you for updating us about what you’ve done so far. It sounds like a staging site would be a good idea. If your host doesn’t offer that option, we recommend WP Staging for quickly spinning up a new test site.

    Once your staging site is up, please update the staging site to the latest WooCommerce version and see if you can replicate this layout behavior.

    If yes, perform a full conflict test by deactivating all your plugins except WooCommerce and switch your theme to Storefront instead of the child theme. Does this still show the layout issue?

    If yes, could you please share a copy of your site’s System Status to check how your site is setup? You can find it via WooCommerce > Status.
    Select “Get system report” and then “Copy for support”.? Once you’ve done that, paste it here in your response.

    Thanks.

    Thread Starter smitchio

    (@smitchio)

    Hi Tseten D,

    Thank you so much for your help and advice.

    I was convinced it was WooCommerce so updated everything including Storefront theme but NOT WooCommerce and it broke again and reverted back to an old backup.

    I have since downloaded and created a staging site using WP Staging as suggested. I have updated everything including WooCommerce but NOT storefront and nothing has broken. So… it must be Storefront theme. (I can’t find that anyone else is having any other issues with the latest update of Storefront)

    I have diff merged the new and old storefront themes and there are very minor (or so I think!) changes to the various files so I wonder if there is a conflict somewhere. That would be beyond my knowledge.

    So, in summary, the Site is looking ok on staging but I still need to update to storefront which seems to break it. Please let me know if this is better in another thread somewhere.

    Again, any advice gratefully received.

    Thanks,

    Sophie

    Plugin Support Tseten a11n

    (@tibetanitech)

    Hi Sophie,

    I’m glad to know that you were able to find the source that was causing your WooCommerce latest version to break your site.

    You mentioned that on the staging site, you were able to update to the latest version when you didn’t update the Storefront theme. I ran a test on my end and was not able to replicate the site crash behavior with latest version of WooCommerce + Storefront.

    Is it possible that there is custom codes in your Storefront theme that is causing this behavior?

    You can enable debugging and check if there are any error logs that can help us identify this strange behavior.

    https://docs.woocommerce.com/document/woocommerce-product-search/api/debugging/

    Let us know what you find and we are happy to help troubleshoot this further.

    laceyrod

    (@laceyrod)

    Automattic Happiness Engineer

    Hi there,

    This thread has been inactive for a bit, so I’m going to mark it as Resolved now. If you’re still experiencing troubles with Storefront theme and the site after updating, please feel free to open a new thread to discuss further.

    Cheers!

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Latest update to Woocommerce has broken the layout of my site’ is closed to new replies.