The "_s" for Timber: a dead-simple theme that you can build from. Now with Webpack!
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
bin Fix install-wp-tests.sh Nov 24, 2015
src Import templates with glob Jan 14, 2019
static Use Webpack instead Gulp to compile Sass Aug 1, 2018
tests fixed-up tests Apr 21, 2016
.editorconfig Add scss to editorconfig Nov 6, 2018
.gitignore Add gulp and webpack Oct 23, 2017
.prettierrc.js Add prettierrc Aug 1, 2018
404.php
LICENSE
README.md Update README.md Jan 24, 2019
archive.php
author.php
composer.json
composer.lock
footer.php Code style fixes Aug 1, 2018
functions.php Code style fixes Aug 1, 2018
header.php Code style fixes Aug 1, 2018
humans.txt Add humans.txt! Aug 17, 2017
index.php
package-lock.json cssnano, autoprefixer and svgo Jan 16, 2019
package.json cssnano, autoprefixer and svgo Jan 16, 2019
page.php Code style fixes Aug 1, 2018
phpunit.xml
screenshot.png
search.php
sidebar.php
single.php
style.css Added files from the jarednova/timber repo Feb 25, 2015
webpack.config.js cssnano, autoprefixer and svgo Jan 16, 2019

README.md

The Timber Starter Theme with Webpack

The "_s" for Timber: a dead-simple theme that you can build from. Now with Webpack!

Installing the Theme

Install this theme as you would any other, and be sure the Timber plugin is activated. But hey, let's break it down into some bullets:

  1. Make sure you have installed the plugin for the Timber Library (and Advanced Custom Fields - they play quite nicely together).
  2. Download the zip for this theme (or clone it) and move it to wp-content/themes in your WordPress installation.
  3. Rename the folder to something that makes sense for your website (generally no spaces and all lowercase). You could keep the name timber-starter-theme but the point of a starter theme is to make it your own!
  4. Activate the theme in Appearance > Themes.
  5. Install and build frontend dependencies by navigating to theme folder and running npm install && npx webpack -w
  6. Do your thing! And read the docs.

Building for production

Run cd wp-content/themes/my-theme/ && npm install && npx webpack -p to build minified files for production.

What's here?

src/templates/ contains all of your Twig templates. These pretty much correspond 1 to 1 with the PHP files that respond to the WordPress template hierarchy. At the end of each PHP template, you'll notice a Timber::render() function whose first parameter is the Twig file where that data (or $context) will be used. Just an FYI.

bin/ and tests/ ... basically don't worry about (or remove) these unless you know what they are and want to.

Other Resources

The main Timber Wiki is super great, so reference those often. Also, check out these articles and projects for more info: