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.3k
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
290
Decoupled Days - JAMstack and WordPress for 2020
zgordon
0
180
The State of JavaScript and WordPress in 2020
zgordon
0
940
100 Things to Know About Building, Selling and Supporting Online Courses and Content
zgordon
0
620
Highly Dynamic WordPress Sites with Gatsby and WordPress
zgordon
0
980
How the New Redux Based Data API is Changing Everything in WordPress*
zgordon
0
370
The Data API in WordPress - WCMIA 2019
zgordon
0
1k
Building Custom WordPress Blocks with React - WCPHX 2019
zgordon
0
84
React for Gutenberg, WordPress & Beyond - WordCamp Baltimore 2018
zgordon
0
250
Other Decks in Technology
See All in Technology
[Keynote] What do you need to know about DevEx in 2025
salaboy
0
170
JAZUG 15周年記念 × JAT「AI Agent開発者必見:"今"のOracle技術で拡張するAzure × OCIの共存アーキテクチャ」
shisyu_gaku
1
160
Adapty_東京AI祭ハッカソン2025ピッチスライド
shinoyamada
0
290
後進育成のしくじり〜任せるスキルとリーダーシップの両立〜
matsu0228
7
3.3k
Git in Team
kawaguti
PRO
3
360
PHPからはじめるコンピュータアーキテクチャ / From Scripts to Silicon: A Journey Through the Layers of Computing Hiroshima 2025 Edition
tomzoh
0
130
[Codex Meetup Japan #1] Codex-Powered Mobile Apps Development
korodroid
2
510
成長自己責任時代のあるきかた/How to navigate the era of personal responsibility for growth
kwappa
4
320
能登半島地震において デジタルができたこと・できなかったこと
ditccsugii
0
170
大規模サーバーレスAPIの堅牢性・信頼性設計 〜AWSのベストプラクティスから始まる現実的制約との向き合い方〜
maimyyym
9
4.4k
プレーリーカードを活用しよう❗❗デジタル名刺交換からはじまるイベント会場交流のススメ
tsukaman
0
120
衛星画像超解像化によって実現する2D, 3D空間情報の即時生成と“AI as a Service”/ Real-time generation spatial data enabled_by satellite image super-resolution
lehupa
0
160
Featured
See All Featured
Scaling GitHub
holman
463
140k
How to train your dragon (web standard)
notwaldorf
96
6.3k
Fashionably flexible responsive web design (full day workshop)
malarkey
407
66k
Code Reviewing Like a Champion
maltzj
526
40k
[RailsConf 2023] Rails as a piece of cake
palkan
57
5.9k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
9
870
How GitHub (no longer) Works
holman
315
140k
YesSQL, Process and Tooling at Scale
rocio
173
14k
Done Done
chrislema
185
16k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
140
34k
Side Projects
sachag
455
43k
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
657
61k
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