Craft Commerce Workshop Peers 2016

Workshop given on Craft Commerce 1.1 by Luke Holder at Peers conference 2016

Transcript

5. Outline • Core concepts • Initial setup • Front-end build-out • Write a plugin
6. Core Concepts
7. Elements • Products • Variants • Orders
8. Products • Think “Entry” (URL, post date, localizable)
9. • Think “Section” • Product URL format • Title format • Automatic SKU? • Dimensions? • Multiple variants? • Field layout(s) Product Types
10. Laptop Manufacturer Model number Product Type Examples T-shirt Brand Graphic
11. Product type != taxonomy
12. Variants • Provides different versions of a single product
13. Variant Examples Laptop CPU Memory Screen size T-shirt Color Size
14. All products have at least one variant
15. Default Variant Default Variant Product A Product B Default Variant Default Variant Default Variant
16. Variants • SKU • Price • Stock
17. Purchasables • Variants are a type of purchasable • All purchasables define a unique SKU and a price
18. Purchasable Possibilities • Digital products • Events/tickets • Bookings • Gift vouchers • Donations
19. Cart / Order • Carts become Orders when completed. • Completed is currently triggered when 
 paid or authorized in full.
20. Orders Order Default Variant Default Variant Line Items Default Variant Default Variant Transactions Default Variant Default Variant History Default Variant Default Variant Adjustments Status Purchasable
21. Line Items • Belong to an Order • Populated by a Purchasable. • Costs added and subtracted by adjustments.
22. Adjustments • Affect costs in cart during recalculation. Core Adjusters • Shipping • Discounts • Tax
23. Transactions • Financial records on the order Types • Payment • Authorize only • Refund
24. Order Statuses • Define a custom order processing workflow • A default status is assigned when an order is first completed
25. Order History • Status changes are recorded in the order’s history, along with the reason for the change • Can optionally trigger an email to customer or administrator
26. Promotions • Sales • Discounts
27. Sales • Rules that affect a product’s price before it is added to the cart
28. Discounts • Rules that affect a product’s price after it has been added to the cart
29. Tax • Rules that affect taxes applied to the cart
30. Shipping • Rules that affect shipping costs applied to the cart
31. Setup
32. General Setup
33. Order Fields Setup
34. Order Statuses Setup
35. Order Statuses Emails Setup
36. Order Status Emails Status Default Variant Default Variant Emails
37. Order Status Emails Status Default Variant Default Variant History Status
38. Tax Categories Setup
39. Payment Methods Setup
40. Product Types Setup
41. Tax Setup
42. Shipping Setup
43. Build
44. $ git clone http://github.com/lukeholder/peers
45. peers/style.css ➜ public peers/script.js ➜ public peers/_layout.html ➜ craft/templates/store
46. _layout.html
47. {% set cart = craft.commerce.cart %} Cart Once per page but no penalty for multiple calls
48. {{ craft.session.getFlash('notice') }} {{ craft.session.getFlash('error') }} {% for key, error in cart.allErrors %} <li>{{ error }}</li> {% endfor %} {% if cart.getErrors('email') %}email-error{% endif %} Notices & Errors
49. _products.html
50. {% set products = craft.commerce.products %} {% for product in products %} {% for variant in product.variants %} Products
51. {% set purchasable = product.defaultVariant %} {% set purchasable = product.variant[0] ?? null %} Products
52. {% set products = craft.commerce.products({ type: 'clothing', hasVariant: { color: 'red' } }) %} Only returns products that have a red variant. Variants
53. {% set products = craft.commerce.products({ type: 'clothing', with: ['variants'] }) %} Eager Loading
54. {% set products = craft.commerce.products({ type: 'clothing', with: [‘variants',{ color: 'red' }] }) %} Only populates variants that are red. Eager Loading
55. index.html {% extends 'store/_layout' %} {% block body %} {% include 'store/_products' %} {% endblock %}
56. <form method="post"> <input type="hidden" name="action" value="commerce/cart/updateCart"> <input type="hidden" name="redirect" value="store"> <form> Update Cart
57. Adding to cart Update Cart purchasableId qty note options
58. Adding to cart <form method="post"> <input type="hidden" name="action" value="commerce/cart/updateCart"> <input type="hidden" name="redirect" value="store"> <input type="hidden" name="qty" value="1"> <input name=“purchasableId" value="{{ variant.purchasableId }}"> <form> Update Cart
59. Options Update Cart <select name="options[giftWrapped]"> <option value="no">No gift wrap.</option> <option value="yes">Gift wrapped.</option> </select> Note <input name=“note" value=""/>
60. Updating Addresses Update Cart shippingAddressId or new shippingAddress billingAddressId or new billingAddress sameAddress
61. {{ variant.salePrice|currency(cart.currency) }} {{ variant.price }} Price
63. _cart.html
64. Cart Line Items {% for item in cart.lineItems %}
65. Line Items item.subtotalWithSale Subtotal of line item item.total Total cost of line item including adjustments
66. _index.html {% if cart.lineItems|length %} {% include "store/_cart" %} {% endif %}
67. Update Line Item <input name="action" value="commerce/cart/updateLineItem"/> <input name="lineItemId" value="{{ item.id }}"/> qty note options
68. Remove Line Item <input name="action" value="commerce/cart/removeLineItem"/> <input name="lineItemId" value="{{ item.id }}"/>
70. Adjustments {% for adjustment in cart.adjustments %}
71. _info.html
72. _index.html {% if cart.lineItems|length %} {% include "store/_info" %} {% endif %}
73. Email Email defaults to logged in users email
74. _payment.html
75. Plugin
76. craft/plugins/merch/MerchPlugin.php
77. Order Number Generation
78. Options Validation
79. Address Validation
80. Stock Notifier
81. Thank you @lukeholder