eCommerce: Layouts on the "built-in" components

Hi Treepl Forum

After a bit of confusion about the “Related product” component today on Slack I just wanted your input on how we can make this (and other) components a bit easier to understand.

As I see it there are two things that can be a bit confusing.

If you go to the “Components tag” in your product detail layout for example, then go to “eCommerce” -> “Related Products” you have the ability to get the code for this component (like all other components).

The first problem occurs when you want to select the layout. Many other components in eCommerce (Product List for example) will have a layout dropdown, so some partners might think this is broken since there is no dropdown but you will need to enter the path of the layout you want to use (if you do enter a value the “standard” layout for this particular component will be used). Is there a way we can make this more clear, or should these layouts just be easier to access. Should this open up the file manager popup for you to select/upload a layout file?

Next problem is when you go and select the Item Id. In most cases you just want the related products component to show the related product for the specific product you are watching. But when you press “Item Id” it will give you a list of product, and if you select “Product A” it will show the products related to “Product A”, even though you might be on “Product B”. So the solution to this would be to put in {{this.id}} in the component tag. But this is not very clear in the component manager.

I guess in 99% of the cases you would want it to work with {{this.id}} instead of always showing a particular product related products on all pages :slight_smile:

I am thinking that it should put in {{this.id}} as a default and if you select a specific product in the dropdown it would put in that products id (as it works today)

Hope this makes sense - looking forward to your input :+1:

3 Likes