This is forked from the "_s" for Timber: a dead-simple theme that you can build from. The primary purpose of this theme is to provide a file structure rather than a framework for markup or styles. Configure your css, scripts, and task runners however you would like!
After installation in the assets directory you'll find css/, js/, and static/ is where you can keep your static front-end scripts, styles, or images. In other words, your CSS files, JS files, fonts, and SVGs would live here.
views/ contains all of your Twig templates. These are rendered by PHP files in 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 the data ($context) will be used.
Getting started you will need to install theme dependencies with nvm, npm, and composer.
- Make sure you're running PHP >=8.1. (These instructions were tested with PHP 8.1.)
- Ensure your project has ACF installed and activated. This theme uses ACF for custom fields and options pages.
- Navigate to your project root (where your site's composer.json file lives), and pull in supporting composer packages:
composer require -W timber/timber palmiak/timber-acf-wp-blocks jjgrainger/posttypes - Commit the changes to composer.json & composer.lock
- Navigate to your theme folder
~/sites/YOURSITE/web/wp-content/themes/ - Create a new folder
custom/ - Download a copy of the TS WP starter theme
- Extract and rename it and then navigate to the newly added theme
mv thinkwp-starter-theme-main YOURSITE,cd YOURSITE - Optional - commit the theme files. This is a checkpoint commit for the base theme code.
- Update the theme name to your project name
./update_theme_name.sh YOURSITE - Optional - commit the theme file updates. This is a checkpoint commit for the theme name updates.
- Pull in our base build assets: run
composer scaffold - Commit all remaining code updates.
- Run
nvm install; npm install; npm run build - In your admin panel, go to Appearance > Themes
- Find your new theme and click Activate to use your new theme right away.
Our Timber-based theme requires ACF (Advanced Custom Fields) Pro. ACF requires a paid subscription -- you should set this up before further development. Some clients may purchase an ACF subscription, but if they don't you can use ThinkShout's unlimited license.
- Install ACF via Composer. Note that the "auth.json" file asks you to specify a URL. This is only informational on the ACF account side. Adding the pantheon live URL is a sensible default choice.
- Enable ACF through the WordPress UI (you'll need to do this on whatever database is going to become the install source for developers)
- Activate the ACF Pro license through the WP UI (again, this must be done on the source database so it can proliferate)
For most development tasks, simply run npm start to start Parcel's watch, which will compile the projects CSS and
JavaScript as well as Tailwind in JIT mode.
Additionally, there are a number of scripts to aid in theme development (assume npm run prefix):
buildto compile css, js, and print css for production.clear-cachedeletes the .parcel-cache directory, is useful for troubleshooting build errors.format: Formats assets, tokens, and SVG files.lint: to check styling errors in js/css files. Ran automatically if you commit while inside the theme directory.print.bundleBundle the print stylesheet for production.theme.build.prodCreate the production build.theme.build.devCreate the development build.theme.build.adminCreate the admin build for WP-Admin.theme.watchStart the watch of the project in development mode (aliased tonpm start)
Please visit the Wiki to get started and for more information:
External docs for relevant theme technologies: