Product attributes and options

Products are not created equally, and in some cases the customer gets to decide the type of product they want. For example, your store may sell t-shirts, and the customer may find a design they like but need to get it in a certain size. In a situation like this, you will need to take advantage of the product attribute system in Ubercart. It lets you define attributes (like size), give them options (like small, medium, and large), and enable attributes and options on a per-product basis. For an example, check out the Ubercart Beanie on the Livetest.

Before exploring the process of creating attributes/options and applying them to products, make sure you understand this distinction. Attributes and their options are created on a global level with their own default settings. These are then applied to products individually after they're created (or during their creation when using product classes). The settings for attributes and options applied to products are specific to that product, and they default to the global defaults but may be adjusted on each product as need be.

To get started, you'll need to make sure you have enabled the Attribute module. You must also be logged in as a user with access to administer attributes. You must create attributes and options globally before adding them to the products using the following steps.

Creating an attribute and its options

1. Browse to Administration » Store » Products » Attributes (admin/store/products/attributes).
2. Click on the Add an attribute tab or link and fill in the form. In the case of the Ubercart Beanie, the name and label were entered as Size and the order was left at 0. Order determines the sorting of attributes on a product. Remember this is a default and may be overridden on each product if need be.
3. Submit the form to create the new attribute.
4. In the table of attributes, find the row for your new attribute and click on its operations link titled options.
5. This page shows a table of existing attributes and includes a tab and link labeled Add an option that you use to access the form you use to add options to this attribute. Each option you add will appear on the product's add to cart form for this attribute. You don't have to enable every option for each product, but you must predefine any option here that you want to make available on your products. Here again you're setting up default values. The values for cost, price, and weight are flat value adjustments. These can be positive or negative numbers. In the case of the Ubercart Beanie, two options titled Small and Medium were added with empty values in the price and weight adjustments. A Large option was added with a $1.00 price increase associated by default with that option. Since the ordering of the options defaults to alphabetical order when all options have the same order value, the options were given order values of 1, 2, and 3 for Small, Medium, and Large respectively.

Repeat this process every time you want to make a new attribute available for products. You can also come back at any time and create new options associated with existing attributes. For example, the Livetest could decide in the future to sell Extra Large beanies using this Size attribute. This option can be added later and then enabled on a per-product basis for the types of beanies to be offered in Extra Large versions. To assign attribute and options to products, use the following steps.

Here is a quick YouTube screencast of creating an attribute with options on the Ubercart demo site (with admin menu module).

Assigning attributes and options to products

1. Browse to the product you want to affect and click on its Edit tab.
2. This brings up the node edit form, but it also displays several sub-tabs for the edit page. Click on the on the Attributes tab.
3. For products without attributes, there is a link in a table labeled add attributes to this product that you can click on to pull up an add attribute form. If you already have attributes on a product, you can use the add attributes form link in the help text to get to this same form. Here, using the Attributes select box, select the attribute(s) you want to add to this product and submit the form.
4. If you need to adjust any of the attribute's settings for this product, do so in the table showing the attributes assigned to this product and click the Save changes button. Be aware that selecting a text field display will disregard the options you enable for the attribute except to fill in the text field with the default option if you have specified one.
5. Now click on the Options tab.
6. Here you will see a table for each attribute you have assigned to this product. It contains a listing of all the options associated with these attributes. When an attribute is added, all of its options are enabled by default. For each option, verify that the values set are correct, or disable any options that aren't available for this product. Here you may override the defaults and not affect any other product. You can also specify a default value to be selected already when the add to cart form is displayed for this product. If an attribute is marked as required, it will actually disregard the default selection so that customers are forced to look at this field and make their own decision.
7. Submit the form when you have made all your selections and changes.

Here's a short YouTube screencast of adding an attribute to a product on the Ubercart demo (with admin menu module).

At this point, you would be finished for this product and can now select the option you want when you go to add this product to the cart. Items in the cart will have lines showing the customer their selections. If the customer adds the same product to the cart with different options selected, it will be displayed in the cart separately. It is possible to use alternate SKUs for products depending on the options selected. Read the adjustments documentation to learn how to take advantage of this functionality.

Making a textfield attribute

Many Ubercart users have taken advantage of our attribute system to let customers enter custom messages or text for a specific field. If you simply need a text field where a customer can enter, for example, a name to be engraved on a plaque, follow the above steps for creating an attribute but don't create any options for it. Any attribute assigned to a product with no options enabled will be displayed in the add to cart form as a text field where the customer can enter their own message. There are limits to this method in number of characters allowed and the lack of validation, so you may end up needing to have a custom module made if you need to change either one of these things.

As mentioned above, you can also specify any attribute to be displayed as a text field even if it has options enabled. The options will be disregarded except to put the default option text in the text field if a default has been selected.

If the products you sell will regularly make use of various attributes and options, you should consider using product classes with default attributes and options to avoid some of the monotony of creating all your products. Refer to the product class documentation for more details.