Tagged: 

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #1335430

    Hello,

    I have the situation, that product images in the cart are not shown if I have a device with less than 425px width. They are displayed perfectly in wider resolutions.

    The shop uses WooCommerce 6.0.0 and Enfold 4.8.2 with a Child Theme.

    I tried the solution from a past thread in 2017, but the solution from back then did not change anything.

    Any ideas what I could try?

    regards,
    Karin

    #1335512

    Hey Karin,

    Thank you for the inquiry.

    The product image in the cart dropdown is displaying correctly on our end. Please check the screenshot below (see private field). Is it only happening when adding a certain product?

    Best regards,
    Ismael

    #1335536

    Hello Ismael,
    This is not the picture I meant. The pictures affected are the ones in the cart table below, you can see it on your screenshot. Next to the X with which you can remove a product from your cart, there should be a picture.
    If I use a tablet or PC, it’s visible. If I use a mobile phone, it’s not visible.

    best regards,
    Karin

    #1335580

    Hi,

    Thank you for the clarification.

    Looks like the cart item or cart row requires a bit of style adjustment. Please add this css code in the Quick CSS field or in the style.css file.

    @media screen and (max-width: 767px) {
        .woocommerce .shop_table .woocommerce-cart-form__cart-item td::before {
          display: none;
        }
      
        .woocommerce-cart-form__cart-item {
          display: flex;
        }
      
        .woocommerce-cart-form__cart-item .remove {
          left: 50%;
          top: 50%;
          transform: translate(50%, 50%);
          text-indent: 9999px;
        }
      
        .responsive table.shop_table.cart .product-name {
          padding: 3px 10px 3px 3px;
          border-right: 1px solid;
        }
      }
    

    The cart item should look like this after adding the css.

    Screenshot: https://1drv.ms/u/s!AjjTfXSRbKTvwAQaC1FRsHpgeidM

    Did you install a plugin to extend the functionality of the cart? It might have affected the default layout of the cart page.

    Best regards,
    Ismael

    #1335604

    Hello Ismael,

    That’s exactly how I want the cart page to look. Unfortunately, I am not able to reproduce your solution. The code you suggested does not work.
    I have no plugin installed which alters any functionality in the cart process and I also do not have any other CSS added which uses the same classes.

    best regards,
    Karin

    #1335610

    Hi Karin,

    Could you please try copying the code from here – https://pastebin.com/JkarSiAb and check if that helps?

    Regards,
    Yigit

    #1335871

    Hello,

    no, the images are still not shown on mobile phones, nothing has changed.

    regards,
    Karin

    #1335981

    Hi,

    Thank you for the update.

    Did you enable the Enfold > Performance > File Compression settings? Please try to disable it temporarily, then purge the cache. Or post the login details in the private field so that we can test the modification.

    Best regards,
    Ismael

Viewing 8 posts - 1 through 8 (of 8 total)

You must be logged in to reply to this topic.