Adding product variations
Video: Adding product variationsWe now have three products on our site. Let's review how they got there. We first created the products themselves based on a product type called product, and if we go up to Store, and click Products, we see the three products themselves. These are all based on the product type called product. After we created these products, we displayed them by creating product display nodes, and we can see those by going to Content, and there are all of our product display nodes. Creating and displaying product in Drupal Commerce always happens in those two steps.
Viewers: in countries Watching now:
This course shows how to build an online store using Drupal Commerce, a set of modules that extend Drupal. Author Tom Geller teaches the basics of configuring a store, processing a payment, and charging for shipping and taxes, as well as creating, displaying, and categorizing products. The course also explains how to integrate a store into a Drupal site, customize a store's appearance, and increase site traffic using search engine optimization (SEO) techniques.
- Surveying the store-building process
- Installing Drupal Commerce using Commerce Kickstart
- Accepting PayPal payments
- Processing orders
- Understanding rules and line items
- Listing and importing products
- Managing inventory, orders, and customer profiles
- Streamlining the checkout process
- Launching a store
- Offering product discounts
- Analyzing site traffic with Google Analytics
Adding product variations
We now have three products on our site. Let's review how they got there. We first created the products themselves based on a product type called product, and if we go up to Store, and click Products, we see the three products themselves. These are all based on the product type called product. After we created these products, we displayed them by creating product display nodes, and we can see those by going to Content, and there are all of our product display nodes. Creating and displaying product in Drupal Commerce always happens in those two steps.
First you create the product, then you create a node to display it. It's important to understand this thoroughly, because now we're going to add a complication. You will notice that two of these products are very similar; they're both half liter bottles of olive oil. One of them is lemon- flavored, and the other is plain. They are, in effect, variations on each other. Let's say that we have several flavors, and several bottle sizes. I am going to show you an easier way to create a series of product variations that also improves the shopping experience.
We will do this in three steps. First, we are going to add a field to the product itself that describes the variation, and we will call that Flavoring. Second, we will apply that flavoring to the relevant products, so the plain olive oil will be labeled as plain, and so on. Third, and this is the tricky part, we are going to create a single product display node that displays all of those variations, so we won't need to have three separate display nodes. Instead, the customer will go to them, and select the flavor that he or she wants.
We will start by going back to our product type. To do that, we go up to Store, Products, and Product Types. Now I am going to add a field to our product. It's going to be called Flavoring, and that's going to be of the list type, List (text), and it will be a select list; that's fine. Our options will be Plain, Lemon, Basil, and Chili. Let's scroll down, and save, and then we have some additional options as well.
For example, I will make the Default Flavoring Plain, since that's mostly what we are going to be selling. This Attribute Field Setting is a little bit complex, but you'll see what it does when we start shopping. We do want it to be enabled, however. Go down further, it shows us, again, our Allowed values, and save. Now you will see what happens when we add a new product. How about a half liter bottle of Chili olive oil? I have a graphic and some text that describes that olive oil in my exercise files. If you received this product on a disk, or are a premium member of lynda.com, you also have these exercise files.
We will do that by going up to Add product, and then go to the text file that has all of that information. The SKU is going to be 1003, there is our title, our image, a little alternate text to help with the accessibility, and for price, let's make that $10. And then here's our new field; Flavoring. That's going to be Chili, and save product.
Before we go on, I want to edit the other two olive oil bottles: Lemon-flavored olive oil, and the plain olive oil. This is step two that we had. So I will go in and edit. Here is the Lemon-flavored one; I'll change it to Lemon, and save. And go back to our products, and edit the plain one, so that it says Plain. Very good! Now as usual, we will add a product display to show that Chili-flavored olive oil we added. This part works the same as before.
We go up to Add product display, and start entering the information. I have this all in the exercise file. So I open it; so I will copy my title, and the body text. Scroll down and choose our product -- remember it was Chili-Flavored olive oil -- it pops up, and say that it's Edible oils. Scroll down and save. There; now when we go back to our front page, it shows up the same as all of the other products that we have in our store.
But that's not where we're going to stop. We now want to have all three of the different flavored edible oils to show up in one product display node. To do that, we create one product display node, which will reference multiple products. Before going on, I'm going to make the selection a little bit easier by going up to Structure, and Content types, and product display. Now this field here where it references the product; if we edit it, we see that it's this autocomplete text field. That's actually a little bit harder to work with, because we don't see what all the products are.
I am going to change it to a select list, make it just a little bit easier on ourselves, and continue. Now let's go back and create that product display node that includes all of the flavors of olive oil that we have. To do that, go up to Add product display, say the title is Half-liter bottle of olive oil (plain and flavored). Go back to my exercise file and copy the description here. I am going to select multiple products.
On Windows, you do that by holding the Control key, and on Mac, you do that by holding the Command key, and just selecting the ones that you want, so Olive oil, Lemon-flavored, and Chili-flavored. The type is all Edible oils. Scroll down, and save. Now, you will notice it defaults to Plain as we wanted, and it shows it as $10, but if I change it to Lemon, we immediately see the different product. Same is true for Chili, and if in fact we had different prices, it would have changed the price, and any other attributes.
This is a wonderful way to create a single display node that's more convenient for people to shop. The last thing that I'm going to do is I am going to go back to my list of content, and unpublish the ones that we don't need anymore. We don't need to have all four nodes; one of them that holds three, and the other three individual ones. So I will take Chili-flavored, Lemon-flavored, and ordinary one, and Unpublish it. Now if we go back to our front page, we have the Half-liter bottle of olive oil, and the Lip balm; much cleaner. Pretty cool, huh? But I know what you're thinking.
You are thinking, does this mean we have to add every variation of our product by hand? And the answer is well, yeah, basically. But there is a module that does that, and it takes away a lot of the heavy lifting. It's called Commerce Bulk Product Creation, and you can get it at drupal.org/project/commerce_bpc. If you have trouble installing it, see the video expanding a site's capabilities with modules in lynda.com series Drupal 7 Essential Training.
Find answers to the most frequently asked questions about Create Your First Online Store with Drupal Commerce .
Here are the FAQs that matched your search "" :
- Q; Where can I learn more about how to make a website?
- A: Discover more on this topic by visiting how to make a website on lynda.com.
Sorry, there are no matches for your search "" —to search again, type in another word or phrase and click search.