Which file to override to modify Product list layout on Checkout?

[morphinestyle]

Hello everybody!

I need to add a container DIV wrapping every product in Product list in CHECKOUT to separe every product from each other.
It allows a better and full customization for CSS styling, because in this moment nothing group or wrap every single product making styling very complex.

I take a look to the documentation but I cannot found which file i need to override, because it refers basically to every Product and Product list Views elements but not for Checkout product list.

How can I solve?

[morphinestyle]

Found: com_phocacart/cart_checkout.php

[morphinestyle]

I suggest, however, to add as "feature request" in Phoca Cart: in this way styling can be done without pain and there's no need to override missing possible future updates on this file.

[Jan]

Hi, what do you exactly mean? In checkout, the products are separated by .ph-checkout-cart-row-item div.

Jan

[morphinestyle]

You're right Jan.
But if you want select a "product" become very hard.

For instance: a simple colored background on items page works better with a WHITE products background, without a "product" wrapper become quite impossible to set the items background on white.

I made an override, just to add this "product" wrapper and stylize easily every item.
The CONS is that i will lost future Phoca Cart updates on the checkout layout.

Take a look: https://ibb.co/wQSdz3Z

[Jan]

Hi, I see only white boxes on the screenshot.

Jan

[morphinestyle]

You're right Jan: i will include a real screenshot.
https://ibb.co/9NPvPjp

In the screenshot you can see a simple <div class="prodotto"> wrapper added with a checkout layout override.
--- I added also a wrapper for subtotal rows box for better styling (mobile, desktop, tablet, etc.). ---

As you can see, this simple override allow more control with CSS styling, impossible without a wrapper.

But unfortunately with this override everybody lost the possibility to keep updatd Phoca Cart layout.

Can you consider to add a wrapping DIV on Checkout product list?
Do you find it useful like me?

[Jan]

Hi, to not lose the changes, they should be done in overrides.

Is there really no way to stylize it the same way without the box? Why I asking? Because there is really enourmous pressure of many users to reduce html divs to the smallest possible number of embedded elements. So you ask for adding additional div box, many users ask to remove a lot of boxes (divs) to make the HTML code much easier.

Jan

[morphinestyle]

Hi Jan,
unfortunately there is not a way to obtain this simple effect "white on background": it needs a wrapping div.

I agree to reduce DIVs, surely SEO optimization works better with few div elements on page, and i can understant this approach for product pages, but here we are discussing about the checkout page.

A suggestion: the product IMAGE should stay in a main "column", and in a second column should be added TITLE, QUANTITY, PRICES, ATTRIBUTES and DISCOUNTS. Without this setup css needs to be a little tricky to obtain a uniform/consistent display (asap i will send you a link to show you my PC customization).

[Jan]

Hi, OK, I will take a look at it, but maybe such change should be done for some major version

Jan