Last updated May 16, 2013. Created by Scott J on February 5, 2011.
Edited by Fiable.biz. Log in to edit this page.
Add content type for product display
The node will associate all variations of a product to display them on a single node. When the user picks a variant from the pull-down list, the associated data is updated on the page using Ajax.
We need to add a content type for displaying our new products in a specific content type. Navigate to the "Content Type" section (Structure > Content Types > "Add content type", or http://example.com/admin/structure/types/add) and enter the details of your product type. In our example, we name this new content type "Product display". Then click "Save and add fields".
Manage Fields
You should be on the Manage Fields tab of your content type (Structure > Content Types > [Your Content Type] > Manage Fields Tab, or http://example.com/admin/structure/types/manage/[YourContentType]/fields).
In order to reference one or more products (product variations) with this content display, we need to add a "Product Reference" (field_product) field to this content type. Be sure to set the field type to "Product reference" and the corresponding widget to "Select list" or "Autocomplete text field.". If you choose "Select list", you will get a rolling list of your products for all products you will want to display. This is easier if you have few products to display with this content type. You can label this new field "Product reference". Don't add again the fields defined in the product type. Click on "Save".
Note: You may want to select "unlimited" references in order to associate several variations of the product to one single display (e.g., several sizes and/or several colors). The field should also be set to required.
Manage Display
By clicking the Manage Display tab (Structure > Content Types > [Your Content Type] > Manage Display Tab, or http://example.com/admin/structure/types/manage/[YourContentType]/display), we can change the way the fields for our content type will be displayed. Change the display format for the "Product Reference" field to "Add to Cart form."
| Attachment | Size |
|---|---|
| create_product_display_type.jpg | 50.37 KB |
| save_field_settings.jpg | 26.01 KB |
| nbr_values.jpg | 51.64 KB |
Comments
Multi-select on add to cart form
Hello,
in the example, i added two fields in the product : size and color
but when displaying the produt, the dropdown selection has a very high amout of variants (all colors x all sizes)
wouldn't it be possible to split the variants in different dropdown lists, ie: one for size, another for color?
i couldn't set up this in the display settings.
thanks for your help
EDIT 02.20.12 :
Found! Needed to check "Enable this field to function as an attribute field on Add to Cart forms." in product fields configuration. See example on drupal commerce : http://www.drupalcommerce.org/node/295