Add Display Suite integration for variation fields

I tested the patch and it works, but:

- when I change the varation of product, the price disappears.

- the labels are displayed twice.

The fields will be displayed for the next update ?

Thank you but I do not know the twig

Can we bypass the problem by creating a view with the product variation to integrate it to the product page ?

Thank you but in my view, the change of variation does not change the price

@zenimagine If you check your browser's inspector, you can see that it tries to update the fields with the following selectors:

{command: "insert", method: "replaceWith", selector: ".product--variation-field--variation_sku__12",…}
{command: "insert", method: "replaceWith", selector: ".product--variation-field--variation_title__12",…}
{command: "insert", method: "replaceWith", selector: ".product--variation-field--variation_price__12",…}

So you should set the proper class on your field elements:

product--variation-field--variation_FIELDNAME__PRODUCTID

I do not know how to do that. What do I change in my view ?

Bojanz, it might be built that way, but trying to find the right variable in dump() of product Twig template has been a very frustrating experience so far.

Is there any documentation or examples?

it's very complicated. Will there be a fix on the next version display suite ?

Regarding Commerce Twig variables: https://www.drupal.org/node/2888382#comment-12150972

It would be nice if there was more Commerce documentation available though...

I didn't try this module, but maybe this new module or its concept could be useful for using Display Suite to lay out Commerce Product fields. https://www.drupal.org/project/ds_chains. Here is the introduction: https://www.previousnext.com.au/blog/introducing-display-suite-chained-f....

Display Suite Chained Fields (see #16) does the trick. Works perfectly for variation fields.

Edit: Display Suite Chained Fields is NOT the answer for variations. When 5 variations, it renders all 5 (for example all 5 prices when you use Variations: Price)

@fotograafinge Thank you for verifying that hunch!

@Adrian83: I was too quick in responding. Sadly it doesn't do the trick. I edited my comment.

Too bad :(. Do you mind elaborating on "doesn't do the trick"? Does the Display Suite Chained Fields module only work with nodes, not product entities?

@Adrian83: Because you have multiple variations added to a product, the module renders all variations and not only the values for one you select in your add to cart form. So for this issues the ds_chains module is not the solution. But the module works - as designed - with taxonomy terms on nodes which are also entity reference fields (f.e. "Brand: Logo" if you want to show only the logo field of the 'Brand' taxonomy term added to the product type node, not to the variation node).
When you choose an other product in your add to cart for, f.e. a blue shirt, you want to change to image to a blue shirt. In D7 commerce 1.x you could use "Product: Image" in DS, and the image would change if you choose a certain color in the add to cart for on the product display node. Trying to do the same with ds_chains does not work. Hope this explanation is clearer?

Will the problem be solved with the use of "Layout Builder" ?

Hi! Maybe this information can be useful if you use the patch 3 :
There is a problem when you have a different product type and variation machine names.
I figured out that in the patch we get variation_id equal as product_id.
So, I needed to make changes in this way ( function getDerivativeDefinitions() )
$variation_type_id = $product_type->getVariationTypeId();

Moreover, DS gets the bundle from the form and it is also is an equal product type:
$bundle = $form['#bundle']
But in your hook__form_entity_view_display_edit_form_alter() you can fix it and set
$form['#bundle'] = $variation_type_id;

To my knowledge layout builder does not allow injection of other data as fields in the display. I think it's a mistake to assume that ds is being abandoned.

For my use I need to be able to inject ds fields into a commerce entity view display full stop. Layout builder doesnt give me this.

@tbenice, Do you mean that you want some content to be displayed on all displays of a product type, and you are wanting to use a DS field to add that content to only the display? If so, Layout Builder allows you to add one-off blocks that display the content on all products of the same product type. If you want to be able to use tokens, use the Token Filter module to create a new text filter. I may not be understanding what you're trying to accomplish.

To me this does not look like an issue you can use Display suite with variations currently, the data won't save for classes in the view mode unless you select at the bottom of the display.

Select a layout : Reset Layout

Then it will work and save values and you can add any custom fields from display suite with any classes you want. You won't be able to use the display columns from the other templates but you can use field groups to make your own or alter the twig template to add your own.

It's an easy workaround to consider.

@BigEd, if any layout of DS is selected the variation fields are lost.

No solution for this yet? Im having the same problem with DS and variations. Same issue when using layout builder.