Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
WooCommerce Theme Development Workshop
Search
Zac Gordon
April 08, 2016
Technology
1
2.2k
WooCommerce Theme Development Workshop
For WooConf 2016 - Austin
Zac Gordon
April 08, 2016
Tweet
Share
More Decks by Zac Gordon
See All by Zac Gordon
How We Can Make WordPress Better for the JAMstack
zgordon
0
260
Decoupled Days - JAMstack and WordPress for 2020
zgordon
0
170
The State of JavaScript and WordPress in 2020
zgordon
0
910
100 Things to Know About Building, Selling and Supporting Online Courses and Content
zgordon
0
580
Highly Dynamic WordPress Sites with Gatsby and WordPress
zgordon
0
930
How the New Redux Based Data API is Changing Everything in WordPress*
zgordon
0
340
The Data API in WordPress - WCMIA 2019
zgordon
0
980
Building Custom WordPress Blocks with React - WCPHX 2019
zgordon
0
74
React for Gutenberg, WordPress & Beyond - WordCamp Baltimore 2018
zgordon
0
250
Other Decks in Technology
See All in Technology
1行のコードから社会課題の解決へ: EMの探究、事業・技術・組織を紡ぐ実践知 / EM Conf 2025
9ma3r
12
4.2k
ExaDB-XSで利用されているExadata Exascaleについて
oracle4engineer
PRO
3
270
【5分でわかる】セーフィー エンジニア向け会社紹介
safie_recruit
0
19k
JAWS FESTA 2024「バスロケ」GPS×サーバーレスの開発と運用の舞台裏/jawsfesta2024-bus-gps-serverless
ma2shita
3
260
エンジニアリング価値を黒字化する バリューベース戦略を用いた 技術戦略策定の道のり
kzkmaeda
7
3k
OPENLOGI Company Profile for engineer
hr01
1
20k
ABWG2024採択者が語るエンジニアとしての自分自身の見つけ方〜発信して、つながって、世界を広げていく〜
maimyyym
1
190
スキルだけでは満たせない、 “組織全体に”なじむオンボーディング/Onboarding that fits “throughout the organization” and cannot be satisfied by skills alone
bitkey
0
190
Amazon Q Developerの無料利用枠を使い倒してHello worldを表示させよう!
nrinetcom
PRO
2
120
偏光画像処理ライブラリを作った話
elerac
1
180
LINEギフトにおけるバックエンド開発
lycorptech_jp
PRO
0
350
RayでPHPのデバッグをちょっと快適にする
muno92
PRO
0
190
Featured
See All Featured
RailsConf 2023
tenderlove
29
1k
Why You Should Never Use an ORM
jnunemaker
PRO
55
9.2k
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
Measuring & Analyzing Core Web Vitals
bluesmoon
6
260
Intergalactic Javascript Robots from Outer Space
tanoku
270
27k
Documentation Writing (for coders)
carmenintech
67
4.6k
Reflections from 52 weeks, 52 projects
jeffersonlam
348
20k
The Illustrated Children's Guide to Kubernetes
chrisshort
48
49k
Fantastic passwords and where to find them - at NoRuKo
philnash
51
3k
Building Adaptive Systems
keathley
40
2.4k
YesSQL, Process and Tooling at Scale
rocio
172
14k
Thoughts on Productivity
jonyablonski
69
4.5k
Transcript
WooCommerce Theme Development Zac Gordon | wp.zacgordon.com | @zgordon
What We Will Cover - Add WC Theme Support -
WC Template Hierarchy - Overriding Templates - Updating Templates - Template Functions - Theme Hooks
Recommended Prereqs For WC Theme Developers - Ability to setup
and use WC - Child Themes - WP Template Hierarchy - WP Hooks - HTML, CSS, JS, PHP
About This Workshop And My Interest in It - Based
on Treehouse Course - Released for WooConf 2015 - Why I Love Woo!
add_theme_support( 'woocommerce' );
Just like WP, WC is built on a structured template
system.
WC Template Files in WP
WC on Github https://github.com/woothemes/woocommerce/tree/master/templates
Overriding Templates https://docs.woothemes.com/document/template-structure/ - Works just like Child Themes -
Create a “woocommerce” folder in your theme folder - Copy over only the files you need - Keep the same structure as the plugin “template” folder
Practice: Let’s Play! Add a “woocommerce” folder to any theme
and start customizing templates
Updating Templates https://docs.woothemes.com/document/fix-outdated-templates-woocommerce/ https://docs.woothemes.com/document/template-structure/ - WC templates do get updated
- May have to update your template files - Admin > WooCommerce > System Status
Template Functions https://docs.woothemes.com/document/introduction-to-hooks-actions-and-filters/ - Load other templates - Conditional tests
- Get & Set WC content - wc-template-functions.php
Practice: Let’s Explore! Explore the functionality and source code of
the different template functions available in WC.
WC Hooks: Actions & Filters https://docs.woothemes.com/document/introduction-to-hooks-actions-and-filters/ https://docs.woothemes.com/wc-apidocs/hook-docs.html - Preferred way
for many modifications - Actions let us add code - Filters let us modify content - functions.php - Wc-template-hooks.php - Query Monitor / Hookr.io - Find Where
Practice: Hooking it Up Practice using actions and filters to
move around and modify code. Suggestion - try the Cart & Checkout
Learn More Take the course for free!!! - wp.zacgordon.com -
Look for WP Courses - WC Theme Development - Sign Up through Treehouse