Skip to content Medium logoTwitter logoGitHub logoTumblr logoInstagram logo

Timber: a faster, easier and more powerful way to build themes. Because WordPress is awesome, but the loop isn’t.

What’s Timber?

Timber helps you create fully-customized WordPress themes faster with more sustainable code. With Timber, you write your HTML using the Twig Template Engine separate from your PHP files.

This cleans-up your theme code so your PHP file can focus on supplying the data and logic, while your twig file can focus 100% on the display and HTML.

Who is this for?

Timber is for both WordPress pros and rookies. People new to WordPress will like how it reduces the WordPress-specific knowledge required to theme a website. While pros can take advantage of object-oriented patterns that adhere to DRY and MVC principles.

What does the code look like?

With Timber you manage your theme in PHP and Twig (HTML) files. This separates the logic (getting stuff from WordPress) from presentation (adding tags, classes, etc.) — just like Rails, Django, Node and other platforms.

single.php

$context = Timber::get_context();
$context['foo'] = 'Bar!';
$context['post'] = new Timber\Post();
Timber::render('single.twig', $context);

single.twig

{% extends "base.twig" %}
{% block content %}
	<h1 class="big-title">{{foo}}</h1>
	<h2>{{post.title}}</h2>
	<img src="{{post.thumbnail.src}}" />
	<div class="body"> {{post.content}} </div>
{% endblock %}

What does it look like?

Timber doesn't change the visual appearance of your theme. Installing Timber is like installing jQuery — it just gives you new tools to build and style it as you like.

Object Oriented Posts, Terms, Users and More

Speak to the common WordPress objects in a way that makes sense. Have you ever tried to get the thumbnail of a post?

The old way
$thumb_id = get_post_thumbnail_id($post->ID);
$url = wp_get_attachment_url($thumb_id);
<img src="<?php echo $url; ?>" alt="Thumbnail for <?php echo $post->post_title; ?>" />

Yuck! Maybe you can remember all those functions, but I sure can't. If you're a pro WordPress dev you probably have a mess of shortcut functions to help you with common tasks. But here's the rub: YOUR shortcuts are going to be different than everyone else's.

The Timber way
<img src="{{post.thumbnail.src}}" alt="Thumbnail for Timber" />

Use it a little, use it a lot

Timber works with your existing themes to unlock new power. You don't have to throw out everything you already have working.

The best tools evolve into your workflow: I didn't know I wanted to use jQuery or SASS until I started using them. Bit-by-bit they replaced the 'old' ways of doing things until I couldn't imagine life without them. Timber lets you start with just a bit. Say you want to just include an HTML snippet with a variable from your database:

home.php

$data['welcome_message'] = get_option('welcome_message');
Timber::render('welcome.twig', $data);

welcome.twig

{# welcome.twig #}
<p class="intro">{{welcome_message}}</p>

Support Timber

Timber is a free open-source project for everyone who uses WordPress. The best payment is to Tweet and star the project on GitHub so others can find it and contribute.

Looking to hire a Timber pro?

These firms and experts have got you covered. Are you a Timber pro? Let us know!

Upstatement is the main sponsor of Timber and where the project originated
MIND is a design and digital agency based in Switzerland
OSOM STUDIO builds strong brand identities - comprehensive branding, marketing, websites, e-shops
Nclud created and maintains the Timber CLI project
Connor J Burton is one of the developers of Timber
Lara Schenck is an expert in NYC who creates and teaches WordPress development using Timber
Extended Play is a digital design firm in New York City
Blue State Digital is an internationally recognized digital agency specializing in liberal causes
Mustard Creative is a full service agency based in Melbourne, Australia
Crowd are a global creative communications agency with offices in the UK, USA, Canada, and Dubai
Xfive is a creator of Chisel, a Yeoman generator for developing projects with Timber
Powered By Coffee is a London based development agency focusing on WordPress and WooCommerce
Thinking Juice is an award winning, full-service creative agency with digital at its very heart
DigitalQuery are WordPress developers based in London and Jakarta. We love Timber!
Ad-Lit is a marketing and digital design firm in Wisconsin Dells and Fort Myers, Florida
Code Resolution is an award winning website design and development agency based in the UK
Weeby Studio is a creative studio offering web & design services based in Barcelona, Spain and Bielsko-Biala, Poland
fffunction is a UX focused design agency based in Bristol and Penryn, UK
Rareloop is a digital studio that designs and builds bespoke websites, apps & software. Based in Southampton, UK
Tiger & June is a small, agile web agency based in Nice, France
Kelp Agency is a full-service design & development agency based in Brooksville, Florida
Outsourcify is a digital agency established in 2014 in Bangkok with a team of over 30 web designers & developers
Salad is a creatively led design and communications agency that produces Beautifully Effective® brands and first-in-class digital experiences
Junaid Qadir Baloch is a Timber contributor and web developer based in Pakistan
Yes We Work helps organisations structure information and present it clearly to their key audiences
Strawberry Soup is a digital agency in the UK
mindtwo GmbH is a digital agency based in Bonn, Germany driven by creative innovation, new technology, and client success
Interactive Strategies is a digital agency rooted in strategy that’s obsessed with learning “why”
Bultema Group is a Grand Rapids, Michigan-based design and marketing studio
Fantassin is a creative WordPress agency with a taste for UX design from Lyon, France

Built with Timber

A lot of talented people are using Timber, check out some of the sites they've made!

Want to show off your own Timber project?

timber@upstatement.com