Vote up!
Vote down!

How do I change the order of product attribute widgets?

Is there a way of specifying the display order of product attribute widgets on the Add to Cart form? I've tried changing the order using the field (it uses draggable tables), but this order is not reflected when viewing the product display node. I'm using the Inline entity form - Multiple values widget for this field.

Asked by: richard.french
on April 3, 2013

1 Answer

Vote up!
Vote down!

Great question, Richard, and it's encouraging to see you've already done some research to find the manage display interface.

Product attribute fields have a lot of functionality, so I'll try to limit my answer to your specific question - how do you sort the order in which attribute field widgets (the select lists / radio buttons that let you choose a particular product from a group of referenced products) appear on the Add to Cart form.

The manage display interface for fields on the product type / product display node type aren't really helpful here, because they deal with when and where to display the rendered field into the content area. The Add to Cart form functions more like an add / edit form, though, and is not bound by the sort order of the fields when they're displayed on the page.

Manage Fields Click Here

However, the field widgets on the Add to Cart form will respect the order of the attribute fields in the manage fields interface for the product type. In other words, they'll appear in the same order on the Add to Cart form as they do on the product add / edit form. If you reorder them in that interface, they'll be reordered on the front end.

Manage Fields Draggable

Note that this isn't just a cosmetic difference, though. The order of the attribute fields also determines dependency. When an attribute is selected, any attribute field widgets that appear later in the form will be reset / repopulated to only show valid options for the products on the form. This lets you have something like a store that sells shoes by color and size with the color selected determining the size availability.

Ryan Szrama
Answer by: Ryan Szrama
Posted: Apr 3, 2013


So is there any way that you can make the variation title as the first attribute.

- dottodotdesign on October 30, 2013