Developing A Woocommerce Theme

Developing A Woocommerce Theme
Alternatives To Developing A Woocommerce Theme
Project NameStarsDownloadsRepos Using ThisPackages Using ThisMost Recent CommitTotal ReleasesLatest ReleaseOpen IssuesLicenseLanguage
Awesome Black Friday Cyber Monday Deals187
6 months ago3
🟢LIVE 2022 - Black Friday & Cyber Monday, Christmas & Holidays Deals for Developers, Techies, & Entrepreneurs,
Vue Getting Started181
a year ago196Vue
This project is seen in demos including the Pluralsight course "Vue: Getting Started" to help represent a fundamental app written with Vue. The heroes and villains theme is used throughout the app.
Shopify Starter Theme69
2 years ago20Liquid
Shopify Starter Theme. Based on Laravel-mix and ThemeKit. WatchFull Course Here :
Wp Dev Course52
3 years agoPHP
Example files for my WordPress Development Course on Udemy
3 years agoHTML
🎓 GSU MPA/MPP course on data visualization with R and ggplot2
2 years agobsd-2-clauseHTML
A Template for Bootstrap 4 based on my Bootstrap 4 Layouts course on LinkedIn Learning
Mobiledev Xamarinforms31
2 years ago5mpl-2.0C#
A course on Xamarin.Forms mobile development
Skillshare Examples27
6 years agoLiquid
Examples for my Skillshare course on Advanced Shopify theme development.
Developing A Woocommerce Theme27
8 years ago1PHP
4 days agobsd-3-clauseShell
fast, cute, and-of-course, roundy prompt-theme for Zsh
Alternatives To Developing A Woocommerce Theme
Select To Compare

Alternative Project Comparisons

Developing a WooCommerce Theme

Learn how to create a custom theme for a WooCommerce store, making use of the WooCommerce API to ensure that the screens on your store fit with your overall theme and your store’s brand.

These source files comprise a theme developed for the Tuts+ course, which includes functions (in the functions.php file) that hook into hooks provided by the WooCommerce API. It also contains a template file in the /woocommerce/loop folder that overrides a template file provided by WooCommerce. See Part 5 of the course for a detailed description of how the theme is structured.


This repository has two subdirectories:

  • start: The starter theme for this course project.
  • completed: The completed theme as developed in the course.

The completed theme includes the following template files:

  • archive.php
  • index.php
  • page.php - for static pages
  • page-full-width.php
  • archive.php - for archive pages
  • header.php
  • sidebar.php
  • footer.php
  • loop.php
  • loop-single.php
  • loop-page.php
  • functions.php


Featured images

These are displayed in the archive and index templates if they are present, using the medium size.


The default menu is in header.php, and uses the Menus admin


The theme uses Object Oriented CSS (OOCSS). The following clases are for layout and you can use them in your pages and posts. They are responsive, so will resize on smaller screens (for example the .half class is full width on phones).

  • .full-width
  • .three-quarters
  • .two-thirds
  • .half
  • .third
  • .quarter


There are 7 action hooks:

  • Above the header
  • Inside the header
  • Before the content
  • After the content
  • In the sidebar
  • In the footer
  • After the footer

There are 3 filter hooks:

  • 1 in the header
  • 2 in the footer

Widget Areas

There are six widget areas, all added via the widgets.php file:

  • one in the header
  • one in the sidebar
  • four in the footer

These are source files for the Tuts+ course: Developing a WooCommerce Theme

Available on Tuts+ March, 2015

Popular Theme Projects
Popular Course Projects
Popular User Interface Categories

Get A Weekly Email With Trending Projects For These Categories
No Spam. Unsubscribe easily at any time.