Edit variation layout in cart

Hello Xtemos Team.
In cart, If product have many variations, it will show variation of product by row.
It make cart/check out page, Email show not beautifull.
I want merge all product variations in 1 row.
How to make it. See attacth file

Thanks.

Attachments:

You must be logged in to view attached files.

Hello,

Please provide the product URL which I can add to the cart and view in the checkout with these variations so that I could check if it is possible to do with CSS.

Best Regards

Yes. Please check. I add product link on Private Content.
Thanks.

Hello. Any update?

Hello,

We need more time to check if there any ways to do that.

I will get back to you soon.

Best Regards

Hello,

Now we are checking the checkout and the product does not look like it did on your first screen: https://prnt.sc/ust27b

You have activated a plugin that does not allow you to see the problem.

Please clarify how can we see the problem.

Best Regards

Hello friend.
Check out page not effect it. You can try product have more than 3 variation. You can see it.
Try this:
https://occholtd.com/product/womens-hope-breast-cancer-awareness-pink-flowers-ribbon-t-shirt-women-tshirt-long-sleeve-crewneck-sweatshirt/

https://prnt.sc/utspu3

Hello,

Here is how I see the checkout: https://prnt.sc/utz32u As you can see it is not like https://prnt.sc/utz8af

Best Regards

Product you try check-out only have 2 variation. It will be show correct.
But try with product have 3 variation you can see what i say, as attach file.
Try with this product. Add to cart, then you see it.

https://occholtd.com/product/womens-hope-breast-cancer-awareness-pink-flowers-ribbon-t-shirt-women-tshirt-long-sleeve-crewneck-sweatshirt/

Thank you.

Hello,

I have added the product to the cart and get down to the checkout: https://prnt.sc/uujqga

Best Regards

Wow. How strange. When I checkout it always shows multiple rows.
Which browser do you use?

Hello,

I am checking in Chrome. When you contacted the first time, I checked in Chrome and saw multiple rows, and then it became as I showed on the screen.

Best Regards

Can you help me check it again with this product.
I delete cache.

https://occholtd.com/product/faith-hope-love-beast-cancer-shirt/

This is my check out: https://prnt.sc/uumyvk

Thank you.

Hello,

Please add this code to the Theme Settings > Custom CSS > Global:

ul.variation > li {
  display: inline;
  margin-right: 8px;
}
ul.variation > li p {
  display: inline;
  margin-bottom: 0;
}
ul.variation .item-variation-name {
  margin-right: 4px;
}

Best Regards

Perfect.
Thank for you help Elise.

You are welcome! If you have any questions please feel free to contact us.

Best Regards

[Author]

Posts