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
280
Decoupled Days - JAMstack and WordPress for 2020
zgordon
0
180
The State of JavaScript and WordPress in 2020
zgordon
0
930
100 Things to Know About Building, Selling and Supporting Online Courses and Content
zgordon
0
600
Highly Dynamic WordPress Sites with Gatsby and WordPress
zgordon
0
970
How the New Redux Based Data API is Changing Everything in WordPress*
zgordon
0
360
The Data API in WordPress - WCMIA 2019
zgordon
0
1k
Building Custom WordPress Blocks with React - WCPHX 2019
zgordon
0
79
React for Gutenberg, WordPress & Beyond - WordCamp Baltimore 2018
zgordon
0
250
Other Decks in Technology
See All in Technology
Rethinking Incident Response: Context-Aware AI in Practice
rrreeeyyy
2
940
PHPからはじめるコンピュータアーキテクチャ / From Scripts to Silicon: A Journey Through the Layers of Computing
tomzoh
2
120
第64回コンピュータビジョン勉強会「The PanAf-FGBG Dataset: Understanding the Impact of Backgrounds in Wildlife Behaviour Recognition」
x_ttyszk
0
240
推し書籍📚 / Books and a QA Engineer
ak1210
0
140
shake-upを科学する
rsakata
7
1k
QuickSight SPICE の効果的な運用戦略~S3 + Athena 構成での実践ノウハウ~/quicksight-spice-s3-athena-best-practices
emiki
0
290
Maintainer Meetupで「生の声」を聞く ~講演だけじゃないKubeCon
logica0419
0
110
無理しない AI 活用サービス / #jazug
koudaiii
0
100
Copilot coding agentにベットしたいCTOが開発組織で取り組んだこと / GitHub Copilot coding agent in Team
tnir
0
190
Introduction to Sansan, inc / Sansan Global Development Center, Inc.
sansan33
PRO
0
2.7k
Deep Security Conference 2025:生成AI時代のセキュリティ監視 /dsc2025-genai-secmon
mizutani
4
2.8k
60以上のプロダクトを持つ組織における開発者体験向上への取り組み - チームAPIとBackstageで構築する組織の可視化基盤 - / sre next 2025 Efforts to Improve Developer Experience in an Organization with Over 60 Products
vtryo
3
1.9k
Featured
See All Featured
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
16k
Unsuck your backbone
ammeep
671
58k
Visualization
eitanlees
146
16k
Six Lessons from altMBA
skipperchong
28
3.9k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
48
2.9k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
161
15k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
18
990
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
31
2.4k
StorybookのUI Testing Handbookを読んだ
zakiyama
30
5.9k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
53k
Writing Fast Ruby
sferik
628
62k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
667
120k
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