Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
Ge#ng	
  Started	
  with	
  
WooCommerce	
  
Categories	
  and	
  Products	
  
•  Merrill	
  M.	
  Mayer	
  
•  Kool	
  Kat	
  Web	
  Designs	
  
•  h>p://www.koolkatwebdesigns.com/	
  
•  merrill.maye...
Overview	
  
•  Se#ng	
  up	
  categories	
  and	
  products	
  
•  CreaFng	
  custom	
  templates	
  
•  Using	
  hooks	
...
Case	
  Study	
  
Bon	
  Vivant	
  
•  h>p://bon-­‐vivant.com/	
  
•  Bon	
  Vivant	
  is	
  Sea>le	
  area	
  cooking	
  ...
Category	
  LisFng	
  
Single	
  Product	
  Page	
  
Single	
  Product	
  -­‐	
  Waitlist	
  
Dashboard	
  –	
  Catalog	
  Se#ngs	
  
Dashboard	
  -­‐	
  Catalog	
  Image	
  
Se#ngs	
  
Dashboard	
  Categories	
  
Dashboard	
  Products	
  –	
  Adding	
  Text	
  
Dashboard	
  Products	
  –	
  Price	
  
Dashboard	
  Products	
  –	
  Inventory	
  
Default	
  Category	
  Layout	
  	
  
Single	
  Classes	
  
Default	
  Category	
  Layout	
  
August	
  
Default	
  Single	
  Product	
  Layout	
  
Category	
  LisFng	
  
Single	
  Product	
  Page	
  
Single	
  Product	
  -­‐	
  Waitlist	
  
WooCommerce	
  Templates	
  
CreaFng	
  Templates	
  
•  Copy	
  the	
  files	
  from	
  the	
  WooCommerce	
  plugins	
  
...
WooCommerce	
  Templates	
  
Plugin	
  Templates	
   Theme	
  Templates	
  
Modifying	
  a	
  Template	
  
Displaying	
  Products	
  by	
  Date	
  within	
  Category	
  
•  Remove	
  link	
  to	
  s...
Modifying	
  a	
  Template	
  
content-­‐product_cat.php	
  
Modifying	
  a	
  Template	
  
Showing	
  the	
  Waitlist	
  Form	
  
•  Check	
  if	
  the	
  product	
  is	
  in	
  stoc...
Modifying	
  a	
  Template	
  
single-­‐product/add-­‐to-­‐cart/simple.php	
  
Modifying	
  a	
  Template	
  
Showing	
  the	
  Image	
  CapFon	
  
•  Check	
  if	
  a	
  post	
  thumbnail	
  exists	
 ...
Modifying	
  a	
  Template	
  
single-­‐product/product-­‐image.php	
  
	
  
AcFons	
  and	
  Filters	
  
•  woocommerce_product_tabs	
  
(remove	
  unused	
  tabs)	
  
•  woocommerce_aer_add_to_cart...
AcFons	
  and	
  Filters	
  
woocommerce_product_tabs	
  
AcFons	
  and	
  Filters	
  
woocommerce_aer_add_to_cart_form	
  
WooCommerce	
  DocumenaFon	
  
•  h>p://docs.woothemes.com/documentaFon/plugins/
woocommerce/	
  
Upcoming SlideShare
Loading in …5
×

Getting started with woo commerce

70,088 views

Published on

Adding and customizing categories and products in WooCommerce. Slides are from my Vancouver WordCamp presentation.

Published in: Technology, Business
  • Be the first to comment

  • Be the first to like this

Getting started with woo commerce

  1. 1. Ge#ng  Started  with   WooCommerce   Categories  and  Products  
  2. 2. •  Merrill  M.  Mayer   •  Kool  Kat  Web  Designs   •  h>p://www.koolkatwebdesigns.com/   •  merrill.mayer@yahoo.com   •  @koolkatweb  
  3. 3. Overview   •  Se#ng  up  categories  and  products   •  CreaFng  custom  templates   •  Using  hooks  and  filters  
  4. 4. Case  Study   Bon  Vivant   •  h>p://bon-­‐vivant.com/   •  Bon  Vivant  is  Sea>le  area  cooking  school  where   students  may  register  for  classes  online.    
  5. 5. Category  LisFng  
  6. 6. Single  Product  Page  
  7. 7. Single  Product  -­‐  Waitlist  
  8. 8. Dashboard  –  Catalog  Se#ngs  
  9. 9. Dashboard  -­‐  Catalog  Image   Se#ngs  
  10. 10. Dashboard  Categories  
  11. 11. Dashboard  Products  –  Adding  Text  
  12. 12. Dashboard  Products  –  Price  
  13. 13. Dashboard  Products  –  Inventory  
  14. 14. Default  Category  Layout     Single  Classes  
  15. 15. Default  Category  Layout   August  
  16. 16. Default  Single  Product  Layout  
  17. 17. Category  LisFng  
  18. 18. Single  Product  Page  
  19. 19. Single  Product  -­‐  Waitlist  
  20. 20. WooCommerce  Templates   CreaFng  Templates   •  Copy  the  files  from  the  WooCommerce  plugins   template  directory  to  a  WooCommerce  directory  in   your  theme  folder.   •  You  only  need  to  copy  files  that  you  wish  to  modify,   not  every  template  file   •  Do  not  copy  the  templates  folder   •  Do  not  modify  files  in  the  plugin  directory  
  21. 21. WooCommerce  Templates   Plugin  Templates   Theme  Templates  
  22. 22. Modifying  a  Template   Displaying  Products  by  Date  within  Category   •  Remove  link  to  sub-­‐category   •  Query  the  products  ordering  by  date   •  Call  the  product  template  to  output  the  products   The  code  is  in  content-­‐product_cat.php.  
  23. 23. Modifying  a  Template   content-­‐product_cat.php  
  24. 24. Modifying  a  Template   Showing  the  Waitlist  Form   •  Check  if  the  product  is  in  stock   •  If  the  product  not  in  stock  show  the  waitlist  email  form   The  code  is  in  single-­‐product/add-­‐to-­‐cart/simple.php.  
  25. 25. Modifying  a  Template   single-­‐product/add-­‐to-­‐cart/simple.php  
  26. 26. Modifying  a  Template   Showing  the  Image  CapFon   •  Check  if  a  post  thumbnail  exists   •  Grab  the  post  excerpt  (capFon)   •  Add  HTML  to  display  the  capFon   The  code  is  in  single-­‐product/product-­‐image.php  
  27. 27. Modifying  a  Template   single-­‐product/product-­‐image.php    
  28. 28. AcFons  and  Filters   •  woocommerce_product_tabs   (remove  unused  tabs)   •  woocommerce_aer_add_to_cart_form   (add  back  to  list  bu4on)    
  29. 29. AcFons  and  Filters   woocommerce_product_tabs  
  30. 30. AcFons  and  Filters   woocommerce_aer_add_to_cart_form  
  31. 31. WooCommerce  DocumenaFon   •  h>p://docs.woothemes.com/documentaFon/plugins/ woocommerce/  

×