Skip to content
Jared Novack edited this page Nov 3, 2013 · 59 revisions

PHP file basics

Before sending data to the .twig file (where the fun happens), you need to setup the page's data inside of your normal theme files (like index.php, single.php, archive.php, etc.)

	$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>
	{% endfor %}
	{% if !posts|length %}
		<li>Sorry, no posts matched your criteria</li>
	{% endif% }
</ul>

Including files

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

If you need to include via a function (like wp_head or wp_footer):

{{function('wp_footer')}}

Documentation

Check out the complete Twig Documentation for more examples.

Contributing

Pull requests are highly appreciated. Feel free to report a bug, typo, enhancement or a feature you want to add to the plugin.

Index

Timber
Clone this wiki locally