Attributes let you define extra product data, such as size or color.
You’ll need to name and give a slug to each attribute, just like we did with categories and tags. You can use these attributes in the shop sidebar using the “layered nav” widgets.
Keep in mind that once you have created an attribute, you can’t rename it later. But don’t worry, if you create an attribute and you want to change its name or a characteristic of an attribute, you can always delete the incorrect one (hovering your mouse over the name and clicking “Delete”) and recreate it by adding the attribute again.
Attributes come in two types, “Text” and “Select”.
Figure 124: Attributes allow you to specify extra product data such as size or color
A Text attribute is a simple description of an item that may define its item type. This is generally a one or two word piece of text to further define your product beyond what categories and tags will do.
Say you’re opening a video game store, selling all the latest games for all the latest consoles. In this case, your top level product category will most likely be Games inside of which the majority of your catalog will reside.
Now, you could very easily create sub categories for different consoles, genres, etc. but this information is better suited as attributes. Why? Because a user can select concurrent attributes while refining their search.
Figure 125: Attributes can break down items allowing customers to refine their search
For example, your customer is looking for a sports game for the PS3. This is as simple as navigating to the Games category, then selecting the PS3 and Sport attributes from a sidebar widget. As you’d expect, this will refresh the page so that it only displays sport games for the PS3. This makes browsing for specific items a whole lot easier for your customer and keeps you from having to create a huge number of categories.
A Select attribute works a little differently. You will want to define a select attribute to a variable product, that is to say a product that may have more than one option, such as size and color. Let’s come back to this in a minute.
Before we go much further, we should probably define the last field in creating an attribute, the “Default Sort Order”. There are three options for this setting:
- Name: Sorts attributes by name in descending order
- Term ID – Sorts the attributes by the Terms which you have defined
- Custom Ordering – Sorts attributes by the order you place them in
This will create the “sort order” for your attributes and their terms as shown in your store.
For example, if you have a clothing shop, you will want to include an attribute labeled “Size”. You create “size” under the attributes window adding the proper name of “Size”, a slug of “size”, in this case the type as “Select” (as you will want your customers to be able to select their size), and custom ordering.
Clicking the “Add Attribute” button now places your new attribute of “Size” into the attributes list on the right hand side.
Figure 126: Creating an attribute is just the first step
If this were a text attribute, we might not need to go any further. However, at this point we’ll need to define exactly what size means. You can do this by clicking the “Configure Terms” button and adding the terms or in this case sizes to our Size attribute.
Figure 127: Defining Attribute terms can be done in the “Configure Terms” window
As you can see in the figure above, we’ve added most of our sizes and we’re in the process of adding the “Small” term. Clicking the “Add New Size” button at the bottom will add the new size to our list.
Here, you may think we’re done. However, now we need to define our sort order. If we left this list alone, the terms would list themselves in alphabetical order. In a typical clothing store, sizes tend to go from smallest to largest, and as such, we’ll need to re-arrange our order a bit. You can do so manually from top to bottom by dragging and dropping the term into its appropriate location.
Figure 128: You can place terms in any order you like with simple drag and drop
In this case, we needed to move our “Small” term to the top of the list so it would show up first. Now, rather than having our sizes order themselves “Medium, Large, Small, XLarge and XXLarge”, we’ll see them in the correct placement of “Small, Medium, Large, XLarge and XXLarge”.
To create a new attribute for color, simply repeat the process by going back to “Attributes” and creating the attribute “Color” and setting terms for the color of the item such as red, green, yellow and so forth.