This is an attempt to follow the instructions, as attempts to install Commerce Kickstart have failed.
how you can build a taxonomy-based product catalog in drupal commerce
If you look over here in my sidebar you will see that I have a catalog bloc
On the mouse curser moving over this block, a dotted rectangle shows round it on the screen and an editing link like a cogwheel on the top right. If you set-up a site and log-in as administrator, the cogwheel will link you to the admin menu for that bloc or go via admin > structure > blocs and remember what it is called in that theme..
that lists out catalog catagories ["coffee holders", "conference swag", and "wearables"]
...that are actually Taxonomy Terms linking them to their Taxonomy Term Pages:
http://demo.commerceguys.com/dc/catalog/coffee-holders
[this shows differently on the video because it shows the site when logged-on as admin. For admin, the term page shows a coffee holder with two tabs, "view" "edit", a paragraph describing the coffee mug and an add-to-cart form with a drop-down list, that moves your page from the one about black mugs to white mugs]
Looking over here at the sidebar I see
-coffee holders, description
--commerce guys mug in white, image, description, $10.00
---"read more" screen has a drop down menu for white or black and an add-to-cart button
-conference swag, description
--messenger bag, image, description, $15---"read more" screen has an add-to-cart button
--keyring pen, image of 3 pens, description, $4---"read more" screen has an add-to-cart button
-wearables, description
--cap, image, description $12---"read more" screen has an add-to-cart button
--T shirt called "e-commerce with Drupal", description, $8---"read more" screen has an add-to-cart button and select button options S, M, L, XL
--T shirt called "looking for smiling faces", description, $8---"read more" screen has an add-to-cart button and select button options S, M, L, XL
--T shirt called "all tied-up", description, $8---"read more" screen has an add-to-cart button and select button options S, M, L, XL
[Taxonomy]-Term Pages in Drupal 7 have been enhanced a little bit, allowing you to specify
♦custom urls, [eg example.com/coffee-holders] allowing you to
♦display a discription on a page, and giving you
♦both a view and a quick edit link here to edit the Taxonomy Term settings.
This particular one - Coffee Holders - has the description and it shows all of my -er different coffee holder products on the demo website.
This ["read more" link under the mug picture] is just a Node Teaser List of Product Display Nodes. The Product Display Node being a special node type that I've made that has both a
♦ Product Reference Field on it, that turns into this handy dynamic Add To Cart Form, and then it also has a
♦ Taxonomy Term Reference Field on it,
which you can see here lets me to tag this [Product Display] Node with a particular taxonomy term and links it back to its term page.
http://demo.commerceguys.com/dc/catalog/coffee-holders/mug
1 Create a taxonomy vocabulary
Now if you wanted to build something like this yourself, the first thing you would need to do, is to create a taxonomy vocabulary for your catalog:
example.com/catalog/coffee-holders/mug#overlay=admin/structure/taxonomy
admin>structure>taxonomy>edit vocabulary [pictures at about 1'24" on the video]
So you can see here my catalog vocabulary, and if we look at the terms I've listed, my three terms are each present, and each one of them has a name, a description, and a custom url alias that just provides a nice search engine friendly url for this term page on the front.
2 Go build a menu; enable a bloc
Once you've listed out each of your taxonomy terms, the next step is to go build a menu for this.
So I'm going to go to stucture>menus, and you can see here that I have a catalog menu, where I have manually added links to each of the term pages.
[screen shows remembered "search engine friendly url" typed into the box. This can be found by going back to >structure>taxonomy>edit vocabulary to cut-and-paste]
Er - Whenever you create these links you can actually use the search engine friendly path that you have defined, and whenever you save this menu link, it will be converted to the actual Drupal path that has been assigned to that taxonomy term.
Whenever you create a menu you automatically get a block, that you can then enable, to show that menu in any of your sidebars. Here ...
structure>blocks [first option on the structure tab]
...you can see my catalog menu block has been placed into the first sidebar. This is a region in the Corolla theme which now has to be installed after Adaptive Themes Core. Once installed it has a tab on the blocks menu. From that tab you see the options shown in the video, where shopping cart, catalog, user menu and user login are all selected for the first sidebar, and I've configured this bloc...
[from the "configure" link on the "catalog" line]
...to not appear on checkout pages - notice I've used checkout asterisk so it will block all of the checkout pages, so that whenever you go to checkout and are in any step of the checkout process, er you do not have a sidebar. I did this to reduce distraction and noise on the checkout form so that the customer doesn't have distraction and when they're trying to complete the checkout process and give you their nolas.
Once you have
♦ built the taxonomy vocabulary,
♦ the menu item,
♦ put your bloc in place...
3 Create a Product node type
the next step is to actually have nodes showing-up in your teaser lists. Drupal Commerce will install a default product type whenever you first enable everything.
store>products second tab is "product type"
On this demo site I also have a T shirt product type, um, for my T-shirt products, er: I'll discuss that in a different screencast [about sized products].
Once you have product types though, the next step is to create a product display node type. So I'm going to go to my Content Types menu.
structure>content type second option on the structure list
You see here I have a product display node type, and the reason being: even though I have product types in the back end, I can list out all the products on my website on the back end, there is no automatic point of display for them on the front end. We've separated-out the front end from the back end in Drupal Commerce, er so that you have a lot more freedom to detirmine how you want to display products to your customers. Whether it's through product display nodes as I am , or some other method involving Views, or Pagemanager and Panels, or something else entirely!
If we look at the fields that I have put on this product display node type, you can see both my product reference field, and my [Taxonomy] Term reference field.
I like the autocomplete textfield widget...https://drupal.org/project/autocomplete_widgets...because it lets me enter products on this node, using the product SKU with the product title with an autocomplete. And I can have as many as I want to, without having to bother with the multi-select select list, or perhaps just an overwhelming checkboxes list if you have many products on the website.
I also have a catalog catagory term reference select list.
So what you do is:
whenever you add a term reference field, you have to choose which vocabulary this is for, and then of course the widget select list autocomplete radios [radio buttons] so that on the product page - which I'll go to this right now - um so that on its edit form, you get to specify how exactly... - I'm denoting which catalog catagory this belongs to. So you can see here my Product Reference Field with the autocomplete, my catalog term reference field with the select list, and again how this is presented on the front end, with an add to cart form, and a link going back to the term page.
Well those are all the things that you need to know [sic], to build your taxonomy-based Drupal Commerce product catalog. Let me pull-up a .pdf here that shows you the different steps: [in a different order on screen]
♦ Create a "Catalog" taxonomy vocabulary, with terms for each of your categories.
♦ Create a "Product display" node type using a product reference field and a term reference field, and create nodes for your products.
♦ Create a "Catalog" menu and display its block.
No comments:
Post a Comment