1 of 9

WooCommerce.com

28% Market Share for Online Store Solutions

Get this presentation and the sample add-on plugin at

http://abbysdoor.com/woocommerce-variation-image-unavailable/

2 of 9

Reasons to Try WooCommerce

Question For You: Why do you want to try (or did try) WooCommerce?

Check for Common Issues Before Installing

And of course, a dev/staging site to test before going live is always a good practice!

Theme frustrations? Not selected a theme yet? Try one that WooThemes offers like Wootique, Storefront, and more...

Setting Up the Store

http://wptest.abbysdoor.com/

TEST EVERYTHING

Common Issues

Override Page and Email Templates

Where to put override files in your theme: https://docs.woocommerce.com/document/template-structure/
If only comfortable with HTML & CSS then these overrides are fine, but if you are ok with PHP then consider if your task can be accomplished with hooks/filters: �https://docs.woocommerce.com/wc-apidocs/hook-docs.html
After updates for WooCommerce in your dev site, use “template debug mode” (under WooCommerce > System Status > Tools) to temporarily disable your overrides and see the new default templates�(Version 3+ use define( 'WC_TEMPLATE_DEBUG_MODE', true ); in wp-config.php)

More Functionality: Existing Add-On Plugins

More Functionality: Create an Add-On Plugin

Sample: WooCommerce No Image for Product Variation Placeholder�http://abbysdoor.com/woocommerce-variation-image-unavailable/

Basic plugin features:

Use WooCommerce hooks or check for WooCommerce
Admin page to assign image, with plugin page link directly to buried settings �(https://docs.woocommerce.com/document/adding-a-section-to-a-settings-tab/)
Applying the script with the WooCommerce "show_variation" JS event�(Sometimes we have to dig through the source to find the WooCommerce JS Events:�https://github.com/woocommerce/woocommerce/blob/master/assets/js/frontend/add-to-cart-variation.js)
Cleanup at uninstall (and stubs for activation/deactivation hooks)

What Else? Your Input, Please!