Skip to content
jarednova edited this page Oct 8, 2014 · 59 revisions

PHP file basics

Before sending WordPress data to the .twig file (where the fun happens), you must set up the page's data inside of your normal theme files (like index.php, single.php, archive.php, etc.). Instead of holding your HTML, these now become configuration files for corresponding .twig templates.

$data = Timber::get_context();
$data['posts'] = Timber::get_posts();
$data['foo'] = 'bar';
Timber::render('index.twig', $data);

Twig Basics

This is where the good stuff happens.

Echo/print arbitrary variables

Normal

<?php echo $foo ?>

Twig

{{ foo }}

Echo/print properties / methods of a WordPress Post

Normal

<?php the_title() ?>

Twig

{{ post.title }}

If statement

Normal

<?php if( has_post_thumbnail() ) : ?>
	<?php the_post_thumbnail() ?>
<?php else: ?>
	<img src="<?php bloginfo( 'stylesheet_directory' ) ?>/images/thumbnail-default.jpg" />
<?php endif; ?>

Twig

{% if post.thumbnail %}
<img src="{{post.thumbnail.src | default(bloginfo('stylesheet_directory')~'/images/thumbnail-default.jpg')" />
{% endif %}

WordPress loop

Normal

<ul>
<?php $query = new WP_Query( array( 'post_type' => 'post' ) ); ?>
<?php if ( $query->have_posts() ) : ?>
	<?php while ( $query->have_posts() ) : $query->the_post(); ?>
	<li><a href="<?php the_permalink() ?>"> <?php the_title() ?> </a></li>
	<?php endwhile; ?>
<?php else : ?>
	<li><?php _e( 'Sorry, no posts matched your criteria.' ) ?></li>
<?php endif; wp_reset_postdata(); ?>
</ul>

Twig. WordPress specific snippet

<ul>
	{% for post in posts %}
		<li><a href="{{ post.permalink }}">{{ post.title }}</a></li>
	{% else %}
		<li>Sorry, no posts matched your criteria</li>
	{% endfor %}
</ul>

Including files

{% include 'my-map.twig' %}

Including PHP or WordPress functions

If you need to include functions like wp_head or wp_footer:

{{ function('wp_footer') }}

See "Integrate With Wordpress" for more advanced usage.

Documentation

Check out the complete Twig Documentation for more examples.

Contributing

Here are ways to get involved:

  1. Star the project!
  2. Answer questions that come through GitHub issues
  3. Report a bug that you find
  4. Share a theme you've built with Timber. This helps transfer knowledge about best practices, etc.
  5. Tweet and blog about the advantages (and criticisms) of the project and Twig
  6. Browse contrib opportunities for areas of WordPress/PHP/code you know well to consider, build or document.

Pull Requests

Pull requests are highly appreciated. About four dozen people have written parts of Timber (so far). Here are some guidelines to help:

  1. Solve a problem. Features are great, but even better is cleaning-up and fixing issues in the code that you discover.
  2. Write tests. This helps preserve functionality as the codebase grows and demonstrates how your change affects the code.
  3. Small > Big. Better to have a few small PRs that address specific parts of the code, than one big PR that jumps all over.
Clone this wiki locally