In this article by William Rice, we will learn about Categories, Products, and Attributes in Magento.

The combination of products, presentation, and service makes our store unique. In this part, we will see how to add products to our store. Before adding products, we need to make some decisions about how we will organize our site. A few minutes of planning now can save us hours of work later.

Categories, Products, and Attributes

Products are the items that are sold. In Magento, Categories organize your Products, and Attributes describe them. Think of a Category as the place where a Product lives, and an Attribute is anything that describes a Product. Each one of your Products can belong to one or more Categories. Also, each Product can be described by any number of Attributes.

Is it a Category or an Attribute?

Some things are clearly Categories. For example, if you have an electronics store, MP3 players would make a good Category. If you're selling jewellery, earrings would make a good Category.

Other things are clearly Attributes. Color, description, picture, and SKU number are almost always Attributes.

Sometimes, the same thing can be used for a Category or an Attribute. For example, suppose your site sells shoes. If you made size an Attribute, then after your shoppers have located a specific shoe, they can select the size they want. However, if you also made size a Category, the shoppers could begin their shopping by selecting their size. Then they could browse through the styles available in their size. So should size be an Attribute, a Category, or both? The answer depends upon what kind of shopping experience you want to create for your customers.

Examples

The hierarchy of Categories, Products, and Attributes looks like this:

1. Category 1
1. Product 1
• Attribute 1
• Attribute 2
2. Product 2
   • Attribute 1
   • Attribute 2
2. Category 2
1. Product 3
• Attribute 1
• Attribute 3
2. Product 4
   • Attribute 1
   • Attribute 3

We are building a site that sells gourmet coffee, so we might organize our store like this:

1. Single Origin
1. Hawaiian Kona
• Grind (whole bean, drip, French press)
• Roast (light, medium, dark)
2. Blue Mountain
   • Grind
   • Roast
2. Blends
1. Breakfast Blend
• Grind
• Caffeine (regular, decaffeinated)
2. Afternoon Cruise
   • Grind
   • Caffeine

In Magento, you can give your shoppers the ability to search your store. So if the shoppers know that they want Blue Mountain coffee, they can use the Search function to find it in our store. However, customers who don't know exactly what they want will browse the store. They will often begin browsing by selecting a category. With the organization that we just saw, when customers browse our store, they will start by selecting Single Origin or Blends. Then the shoppers will select the product they want: Hawaiian Kona, Blue Mountain, Breakfast Blend, or Afternoon Cruise.

After our shoppers decide upon a Product, they select Attributes for that product. In our store, shoppers can select Grind for any of the products. For Single Origin, they can also select Roast. For blends, they can select Caffeine. This gives you a clue about how Magento handles attributes. To each Product, you can apply as many, or as few, attributes as you want.

Now that we have definitions for Category, Product, and Attribute, let's look at each of them in detail. Then, we can start adding products.

Categories

Product Categories are important because they are the primary tool that your shoppers use to navigate your store. Product Categories organize your store for your shoppers. Categories can be organized into Parent Categories and Subcategories. To get to a Subcategory, you drill down through its Parent Category.

Categories and the Navigation Menu

If a Category is an Anchor Category, then it appears on the Navigation Menu. The term "Anchor" makes the category sound as if it must be a top-level category. This is not true. You can designate any category as an Anchor Category. Doing so puts that category into the Navigation Menu.

When a shopper selects a normal Category from the Navigation Menu, its landing page and any subcategories are displayed. When a shopper selects an Anchor Category from the menu, Magento does not display the normal list of subcategories. Instead, it displays the Attributes of all the Products in that category and its subcategories. Instead of moving down into subcategories, the shopper uses the Attributes to filter all the Products in that Anchor Category and the Categories below it. The Navigation Menu will not display if:

• You don't create any Categories, or
• You create Categories, but you don't make any of them Anchors, or
• Your Anchor Categories are not subcategories under the Default Category.

The Navigation Menu will display only if:

• You have created at least one Category
• You have made at least one Category an Anchor
• You have made the Anchor Category a Subcategory under Default.

When you first create your Magento site and add Products, you won't see those Products on your site until you've met all of the previous conditions. For this reason I recommend that you create at least one Anchor Category before you start adding Products to your store. As you add each Product, add it to an Anchor Category. Then, the Product will display in your store, and you can preview it. If the Anchor Category is not the one that you want for that Product, you can change the Product's Category later

Before we add Products to our coffee store, we will create two Anchor Categories: Single Origin and Blends. As we add Products, we will assign them to a Category so that we can preview them in our storefront.

Making best use of Categories

There are three things that Categories can accomplish. They can:

1. Help the shoppers, who know exactly what they want, to find the product that they are looking for.
2. Help the shoppers, who almost know what they want, to find a product that matches their desires.
3. Entice the shoppers, who have almost no idea of what they want, to explore your store.

We would like to organize our store so that our Categories accomplish all these goals. However, these goals are often mutually exclusive.

For example, suppose you create an electronics store. In addition to many other products, your store sells MP3 players, including Apple iPods. A Category called iPods would help the shoppers who know that they want an iPod, as they can quickly find one. However, the iPods Category doesn't do much to help shoppers who know that they want an MP3 player, but don't know what kind.

On the Web, you usually search something when you know what you want. But when you're not sure about what you want, you usually browse. In an online store, you usually begin browsing by selecting a Category. When you are creating Categories for your online store, try to make them helpful for shoppers who almost know what they want.

However, what if a high percentage of your shoppers are looking for a narrow category of products? Consider creating a top-level Category to make those products easily accessible. Again, suppose you have an electronics store that sells a wide variety of items. If a high percentage of your customers want iPods, it might be worthwhile to create a Category just for those few products. The logs from the Search function on your site are one way you can determine whether your shoppers are interested in a narrow Category of a Product. Are 30 percent of the searches on your site for left-handed fishing reels? If so, you might want to create a top-level Category just for those Products.

Attributes

An Attribute is a characteristic of a Product. Name, price, SKU, size, color, and manufacturer are all examples of Attributes.

System versus Simple Attributes

Notice that the first few examples (name, price, and SKU) are all required for a Product to function in Magento. Magento adds these Attributes to every product, and requires you to assign a value for each of them. These are called System Attributes.

The other three examples (size, color, and manufacturer) are optional Attributes. They are created by the store owner. They are called Simple Attributes. When we discuss creating and assigning Attributes, we are almost always discussing Simple Attributes.

Attribute Sets

Notice that the Single Origin coffees have two Attributes: Grind and Roast. Also notice that the blends have the Attributes of Grind and Caffeine.

1. Single Origin
1. Hawaiian Kona
• Grind (whole bean, drip, French press)
• Roast (light, medium, dark)
2. Blue Mountain
   • Grind
   • Roast
2. Blends
1. Breakfast Blend
• Grind
• Caffeine (regular, decaffeinated)
2. Afternoon Cruise
   • Grind
   • Caffeine

In this example, the store owner created three Attributes: Grind, Roast, and Caffeine. Next, the store owner grouped the Attributes into two Attribute Sets: one set contains Grind and Roast, and the other set contains Grind and Caffeine. Then, an Attribute set was applied to each Product.

Attributes are not applied directly to Products. They are first grouped into Attribute Sets, and then a set can be applied to a Product. This means that you will need to create a set for each different combination of Attributes in your store. You can name these Sets after the Attributes they contain, such as Grind-Roast. Or, you can name them after the type of Product which will use those Attributes, such as Single Origin Attributes.

If each Product in a group will use the same Attribute as every other Product in that group, then you can name the set after that group. For example, at this time, all Single Origin coffees have the same Attributes: Grind and Roast. If they will all have these two Attributes and you will always add and remove Attributes to them as a group, then you could name the set Single Origin Attributes.

If the Products in a group will likely use different Attributes, then name the set after the Attributes. For example, if you expect that some Single Origin coffees will use the Attributes Grind and Roast, while others will use just Roast, then it would not make sense to create a set called Single Origin Attributes. Instead, create a set called Grind-Roast, and another called Roast.

Three types of Products

In Magento, you can create three different types of Products: Simple, Configurable, and Grouped. The following is a very brief definition for each type of Product.

Simple Product

A Simple Product is a single Product, with Attributes that the store owner chooses. As the saying goes, "What you see is what you get." The customer does not get to choose anything about the Product.

In our coffee store, a good example for a Simple Product might be a drip coffee maker. It comes in only one color. And while the customer can buy drip coffee makers of various sizes (4 cups, 8 cups, 12 cups, and so on), each of those is a separate Product.

A bad example of a Simple Product would be a type of coffee. For example, we might want to allow the customer to choose the type of roast for our Hawaiian Kona coffee: light, medium, or dark. Because we want the customer to choose a value for an Attribute, that would not be a good Simple Product.

Configurable Product

A Configurable Product is a single Product, with at least one Attribute that the customer gets to choose. There is a saying that goes, "Have it your way." The customer gets to choose something about the Product.

A good example of a Configurable Product would be a type of coffee that comes in several different roasts: light, medium, and dark. Because we want the customer to choose the roast(s) he wants, that would be a good Configurable Product.

Grouped Product

A Grouped Product is several Simple Products that are displayed on the same page. You can force the customer to buy the group, or allow the customer to buy each Product separately.

The previous definitions are adequate for now. However, when you start creating Products, you will need to know more about each type of Product.

Create a dynamic, fully featured, online store with the most powerful open source e-commerce software Step-by-step guide to building your own online store Focuses on the key features of Magento that you must know to get your store up and running Customize the store's appearance to make it uniquely yours Clearly illustrated with screenshots and a working example http://www.packtpub.com/magento-beginners-guide/book

Putting it together

In the previous sections, we covered the definitions of Product, Category, and Attribute. A Product appears when it is assigned to an active Category, and that Category is an Anchor, or is under an Anchor Category. Attributes are added to sets, and a set can then be applied to a Product.

I recommend that before you add Products to your store, you create the Anchor Categories into which you will place those Products. This enables you to preview how those Products will appear in your store. I also recommend that you create the Attribute Sets you will need for those Products.

Let's put these concepts into action. In our new store, we will:

1. Create some Anchor Categories.
2. Create some Attribute Sets.
3. Add a few Products.

Time for action: Creating Categories

In this section, we will create a Category for our store. We will make it an Anchor Category so that customers can search for the Products in this category based on their Attributes.

Before you begin

As Categories are the main tools for organizing your store, it is important to make best use of them. Plan which Categories you want to use. What will make products easiest to find? What will entice potential customers to explore? Also, remember that space in the Navigation Menu is limited. So, choose your Anchor Categories carefully.

The result of the following steps is an Anchor Category. By making slightly different choices, you can also create non-Anchor Categories and Subcategories.

1. Log in to your site's backend, which we call the Administrative Panel:



2. Select Catalog | Manage Categories:



Notice that there is already one Category, called Default:



You are going to add your new Category under Default. Doing this will create a Subcategory. This step is essential, because only those Anchor Categories that are children of the Default Category will appear in your Navigation Menu.

You can add Categories so that they are not under the Default Category. They will be at the same level as Default. However, only Categories under Default will automatically appear in the Navigation Menu. If a Category is not under Default, you will need to create some other way for your customers to get to that Category.

For example, look at these Categories. Notice that Single Origin Coffees is under Default, while I don't appear in the Nav Menu is not:



The result will be a Navigation Menu with only Single Origin Coffees displayed:



3. Select the Default Category.
4. Click on Add Subcategory. A blank, New Category window is displayed:



5. Enter a Name for the Category. This will display in your storefront. In our example, we will enter Single Origin Coffees:



6. For the setting Is Active, selecting Yes makes the Category visible to customers. Selecting No will hide this Category and its Subcategories in your store.

Because we want this Category to appear in the Navigation Menu, we will select Yes.

7. The URL Key enables you to enter a search-engine-friendly path for this Category. In this example, I entered single-origin-coffees so that when a shopper selects this Category, the address in their browser reads http://brew-me-a-cup.com.

If you leave this field blank, Magento will put the name of the Category into this field. You cannot enter spaces into this field.

8. The Description that you enter here will appear on the Category's landing page.
9. The Image that you upload will also appear on the Category's landing page. Here is what the page looks like so far:



The default Magento template will re-size the Category's image so that it is 475-pixels wide. If you upload an image that is taller than it is wider, the image will take up a lot of space on the landing page. For example, I've uploaded an image that is 240-pixels wide and 266-pixels high. Magento resized the image so that it is 475-pixels wide and 526-pixels high. Notice how much space this image takes up:



Also notice that the background of the image is solid. It does not allow the gradient on the page to show through. I want an image that will not take up so much vertical space. And, I want the gradient to show through. I solved both problems with this image, which is 475-pixels wide, 266-pixels high, and has a transparent background:



Because the image is already 475-pixels wide, Magento did not re-size it. The result is less space taken up by the image, and more space left for my products.

A full discussion of working with graphic images is beyond the scope of this article. However, here is a hint for creating graphics for your Category landing pages. Design the subject of the graphic according to the size you want. In this example, it was the African continent. Then, make the canvas of the graphic 475-pixels wide. Finally, make the background transparent. The result will be an image that is the right size for your landing page.

10. The Page Title appears in the browser's title bar. This is not the same as the Name. The Name appears in the Navigation Menu at the top of the page, not in the browser's title bar:



The Category's Name and Page Title are both opportunities for you to help the page's search engine rank. You can make them identical, which will help the page score better when people search for that term. Or, you can make them different so that both search terms will be covered by this one page.

11. The Meta Keywords and Meta Description appear in meta tags, in the page's HTML code. Enter information about this page, which you think will help search engines to properly categorize this page.

A meta tag contains information not normally displayed to the user. It contains information about the page. The word "meta" means "about this subject". Webmasters use meta tags to tell search engines about a page and help the search engines better categorize that page.

You can see the meta tags in a page if you view the pages' source code. The following code shows the first few lines of source code for the Single Origin Coffees page. Notice the last two meta tags:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"
lang="en">
<head>
<title> Single Origin Coffee from Brew-Me-A-Cup -
Default Store View </title>
<meta http-equiv="Content-Type" content="text/html;
charset=utf-8"/>
<meta name="description" content="single origin coffees"/>
<meta name="keywords" content="single origin coffee"/>

Use Meta Keywords and Meta Description as opportunities to optimize the page for search engines.

12. For Display Mode, select Products only. This will cause the Category's landing page to display a list of products from that Category.

You can also select Static block only or Static block and products. We are not selecting these now because we are not covering Static Blocks in this beginner's guide.

13. If we chose to show a Static Block, we would use the CMS Block setting to specify which Block to display. For now, we can ignore this setting.
14. We want shoppers to be able to filter products under this Category. So for Is Anchor, we will choose Yes.
15. Click on the Save Category button.
16. This completes the General Information tab for the Category. There are two other tabs: Category Products and Custom Design. We will learn about these tabs later. We have done everything to get this Category to work in our store.

What just happened?

You now have at least one Anchor Category under the Default category. This new Anchor Category has its own landing page, which you customized with text and a graphic. The Products under this Anchor Category will be listed on its landing page.

Have a go hero

Now that we have an Anchor Category, we can press ahead and complete the other steps needed to create our catalog. Or, we can create more Categories. For our coffee store, create several more Categories so that our store is organized like this:

• Single Origin Coffees
  • Latin American
  • African
  • Hawaiian
• Blended Coffees

Single Origin and Blended will be Anchors. The result will look as follows:

Once we have the Categories, we need to hold our Products, it's time to add Attribute Sets.

Summary

In this article, we created Categories that will hold our Products. Think of a Category as a department in a physical store. In Part 2 of this article, we will learn how to Create Attributes and Attribute Sets.

Create a dynamic, fully featured, online store with the most powerful open source e-commerce software Step-by-step guide to building your own online store Focuses on the key features of Magento that you must know to get your store up and running Customize the store's appearance to make it uniquely yours Clearly illustrated with screenshots and a working example http://www.packtpub.com/magento-beginners-guide/book

About the Author

William Rice

William Rice is a software training professional who lives, works, and plays in New York City. His indoor hobbies include writing books and spending way too much time reading sites like slashdot and 43folders. His outdoor hobbies include orienteering, rock climbing, and edible wild plants (a book on that is coming someday).

William is fascinated by the relationship between technology and society: how we create our tools, and how our tools in turn shape us. He is married to an incredible woman who encourages his writing pursuits, and has two amazing sons.

For more updates on him and his work, you could visit his online blog: http://williamriceinc.blogspot.com.