first commit

404.php

@@ -0,0 +1,11 @@
+<?php
+/**
+ * The template for the 404 page
+ */
+
+namespace App;
+
+use Timber\Timber;
+
+$context = Timber::context();
+Timber::render( 'templates/404.twig', $context );

LICENSE

@@ -0,0 +1,7 @@
+Copyright (c) 2012-2024 Timber team
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

README.md

@@ -0,0 +1,36 @@
+# The Timber Starter Theme
+
+[![Build Status](https://travis-ci.com/timber/starter-theme.svg?branch=master)](https://travis-ci.com/github/timber/starter-theme)
+[![Packagist Version](https://img.shields.io/packagist/v/timber/starter-theme?include_prereleases)](https://packagist.org/packages/timber/starter-theme)
+
+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 SASS files, scripts, and task runners however you would like!
+
+## Installing the theme
+
+Follow the guide on [how to Install Timber using the Starter Theme](https://timber.github.io/docs/v2/installation/installation/#use-the-starter-theme).
+
+Then,
+
+1. Rename the theme folder to something that makes sense for your website. You could keep the name `timber-starter-theme` but the point of a starter theme is to make it your own!
+2. Activate the theme in the WordPress Dashboard under **Appearance → Themes**.
+3. Do your thing! And read [the docs](https://timber.github.io/docs/).
+
+## The `StarterSite` class
+
+In **functions.php**, we call `new StarterSite();`. The `StarterSite` class sits in the **src** folder. You can update this class to add functionality to your theme. This approach is just one example for how you could do it.
+
+The **src** folder would be the right place to put your classes that [extend Timber’s functionality](https://timber.github.io/docs/v2/guides/extending-timber/).
+
+Small tip: You can make use of Composer’s [autoloading functionality](https://getcomposer.org/doc/04-schema.md#psr-4) to automatically load your PHP classes when they are requested instead of requiring one by one in **functions.php**.
+
+## What else is there?
+
+- `assets/` is where you can keep your front-end scripts, styles, or images. In other words, your Sass files, JS files, fonts, and SVGs would live here.
+- `views/` 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.
+- `tests/` ... basically don’t worry about (or remove) this unless you know what it is and want to.
+
+## Other Resources
+
+* [Twig for Timber Cheatsheet](https://notlaura.com/the-twig-for-timber-cheatsheet/)
+* [Timber and Twig Reignited My Love for WordPress](https://css-tricks.com/timber-and-twig-reignited-my-love-for-wordpress/) on CSS-Tricks
+* [A real live Timber theme](https://github.com/laras126/yuling-theme).

archive.php

@@ -0,0 +1,39 @@
+<?php
+/**
+ * The template for displaying Archive pages.
+ *
+ * Used to display archive-type pages if nothing more specific matches a query.
+ * For example, puts together date-based pages if no date.php file exists.
+ *
+ * Learn more: https://developer.wordpress.org/themes/basics/template-hierarchy/
+ */
+
+namespace App;
+
+use Timber\Timber;
+
+$templates = [ 'templates/archive.twig', 'templates/index.twig' ];
+
+$title = 'Archive';
+if ( is_day() ) {
+	$title = 'Archive: ' . get_the_date( 'D M Y' );
+} elseif ( is_month() ) {
+	$title = 'Archive: ' . get_the_date( 'M Y' );
+} elseif ( is_year() ) {
+	$title = 'Archive: ' . get_the_date( 'Y' );
+} elseif ( is_tag() ) {
+	$title = single_tag_title( '', false );
+} elseif ( is_category() ) {
+	$title = single_cat_title( '', false );
+} elseif ( is_post_type_archive() ) {
+	$title = post_type_archive_title( '', false );
+	array_unshift( $templates, 'templates/archive-' . get_post_type() . '.twig' );
+}
+
+$context = Timber::context(
+	[
+		'title' => $title,
+	]
+);
+
+Timber::render( $templates, $context );

assets/scripts/site.js

@@ -0,0 +1,5 @@
+jQuery( document ).ready( function( $ ) {
+
+  // Your JavaScript goes here
+
+});

author.php

@@ -0,0 +1,18 @@
+<?php
+/**
+ * The template for displaying Author Archive pages
+ *
+ * Methods for TimberHelper can be found in the /lib sub-directory
+ */
+
+namespace App;
+
+use Timber\Timber;
+
+$context = Timber::context();
+
+if ( isset( $context['author'] ) ) {
+	$context['title'] = sprintf( __( 'Archive of %s', 'timber-starter' ), $context['author']->name() );
+}
+
+Timber::render( [ 'templates/author.twig', 'templates/archive.twig' ], $context );

composer.json

@@ -0,0 +1,75 @@
+{
+  "name": "timber/starter-theme",
+  "description": "Starter theme to build a Timber theme",
+  "type":"wordpress-theme",
+  "license": "MIT",
+  "authors": [
+    {
+      "name": "Erik van der Bas",
+      "email": "erik@basedonline.nl",
+      "homepage": "https://basedonline.nl"
+    },
+    {
+      "name": "Lukas Gächter",
+      "email": "lukas.gaechter@mind.ch",
+      "homepage": "https://www.mind.ch"
+    },
+    {
+      "name": "Nicolas Lemoine",
+      "email": "nico@n5s.dev",
+      "homepage": "https://n5s.dev"
+    },
+    {
+      "name": "Jared Novack",
+      "email": "jared@upstatement.com",
+      "homepage": "https://upstatement.com"
+    },
+    {
+      "name": "Timber Community",
+      "homepage": "https://github.com/timber/timber"
+    }
+  ],
+  "repositories": [
+    {
+      "type": "composer",
+      "url": "https://wpackagist.org"
+    }
+  ],
+  "require": {
+    "timber/timber": "^2.1"
+  },
+  "require-dev": {
+    "automattic/wordbless": "^0.4.2",
+    "yoast/wp-test-utils": "^1.0",
+    "wp-coding-standards/wpcs": "^3.1",
+    "phpcompatibility/php-compatibility": "^9",
+    "szepeviktor/phpstan-wordpress": "^1.3",
+    "10up/phpcs-composer": "^3.0"
+  },
+  "extra": {
+    "installer-paths": {
+      "vendor/automattic/wordbless/": [
+        "automattic/wordbless"
+      ]
+    },
+    "wordpress-install-dir": "wordpress"
+  },
+  "config": {
+    "allow-plugins": {
+      "roots/wordpress-core-installer": true,
+      "composer/installers": true,
+      "dealerdirect/phpcodesniffer-composer-installer": true
+    }
+  },
+  "autoload": {
+    "psr-4": {
+      "App\\": "src/"
+    }
+  },
+  "scripts": {
+    "test": "phpunit",  
+    "cs": "@php ./vendor/bin/phpcs --colors -s -p -v ./",
+    "cs:fix": "@php ./vendor/bin/phpcbf --colors -s -p -v ./",
+    "phpstan": "@php ./vendor/bin/phpstan analyse"
+  }
+}

functions.php

@@ -0,0 +1,19 @@
+<?php
+
+/**
+ * Functions and definitions
+ *
+ * @link https://developer.wordpress.org/themes/basics/theme-functions/
+ * @link https://github.com/timber/starter-theme
+ */
+
+namespace App;
+
+use Timber\Timber;
+
+// Load Composer dependencies.
+require_once __DIR__ . '/vendor/autoload.php';
+
+Timber::init();
+
+new StarterSite();

humans.txt

@@ -0,0 +1,10 @@
+## Team
+
+Your name or company
+https://yoursite.example
+@your_twitter_handle
+
+
+## Site
+
+Software: Built with [Timber](https://upstatement.com/timber/) by Upstatement

index.php

@@ -0,0 +1,27 @@
+<?php
+/**
+ * The main template file
+ *
+ * This is the most generic template file in a WordPress theme
+ * and one of the two required files for a theme (the other being style.css).
+ * It is used to display a page when nothing more specific matches a query.
+ * E.g., it puts together the home page when no home.php file exists.
+ *
+ * @link https://developer.wordpress.org/themes/basics/template-hierarchy/
+ */
+
+use Timber\Timber;
+
+$templates = [ 'templates/index.twig' ];
+
+if ( is_home() ) {
+	array_unshift( $templates, 'templates/front-page.twig', 'templates/home.twig' );
+}
+
+$context = Timber::context(
+	[
+		'foo' => 'bar',
+	]
+);
+
+Timber::render( $templates, $context );

page.php

@@ -0,0 +1,17 @@
+<?php
+/**
+ * The template for displaying all pages.
+ *
+ * This is the template that displays all pages by default.
+ * Please note that this is the WordPress construct of pages
+ * and that other 'pages' on your WordPress site will use a
+ * different template.
+ */
+
+namespace App;
+
+use Timber\Timber;
+
+$context = Timber::context();
+
+Timber::render( 'templates/page.twig', $context );

phpcs.xml.dist

@@ -0,0 +1,32 @@
+<?xml version="1.0"?>
+<ruleset>
+	<!-- Files or directories to check -->
+	<file>.</file>
+
+	<exclude-pattern>*/node_modules/*</exclude-pattern>
+   <exclude-pattern>*/wordpress/*</exclude-pattern>
+	<exclude-pattern>*/vendor/*</exclude-pattern>
+   <exclude-pattern>*/resources/*</exclude-pattern>
+	<exclude-pattern>*/dist/*</exclude-pattern>
+	<exclude-pattern>*/tests/*</exclude-pattern>
+
+	<!-- Path to strip from the front of file paths inside reports (displays shorter paths) -->
+	<arg name="basepath" value="." />
+
+	<!-- Set a minimum PHP version for PHPCompatibility -->
+	<config name="testVersion" value="8.1-" />
+
+	<!-- Use 10up's phpcs ruleset -->
+	<rule ref="10up-Default">
+		<exclude name="Squiz.Commenting.FileComment.MissingPackageTag"/>
+		<exclude name="WordPress.WP.I18n.MissingTranslatorsComment"/>
+	</rule>
+
+	<!-- Set the text domain to timber-starter -->
+	<rule ref="WordPress.WP.I18n">
+		<properties>
+			<property name="text_domain" type="array" value="timber-starter"/>
+		</properties>
+	</rule>
+
+</ruleset>

phpstan.neon

@@ -0,0 +1,15 @@
+parameters:
+    editorUrl: 'vscode://file/%%file%%:%%line%%'
+    level: 5 # Increase until "max"
+    paths:
+        - src/
+        - %currentWorkingDirectory%/
+    excludePaths:
+        - tests/*
+        - docs/*
+        - vendor/*
+        - wordpress/*
+    ignoreErrors:
+      
+includes:
+    - vendor/szepeviktor/phpstan-wordpress/extension.neon

phpunit.xml

@@ -0,0 +1,14 @@
+<phpunit
+	bootstrap="tests/bootstrap.php"
+	backupGlobals="false"
+	colors="true"
+	convertErrorsToExceptions="true"
+	convertNoticesToExceptions="true"
+	convertWarningsToExceptions="true"
+	>
+	<testsuites>
+		<testsuite name="all">
+			<directory prefix="test-" suffix=".php">./tests/</directory>
+		</testsuite>
+	</testsuites>
+</phpunit>

search.php

@@ -0,0 +1,18 @@
+<?php
+/**
+ * Search results page
+ *
+ * @link https://developer.wordpress.org/themes/basics/template-hierarchy/
+ */
+
+use Timber\Timber;
+
+$templates = [ 'templates/search.twig', 'templates/archive.twig', 'templates/index.twig' ];
+
+$context = Timber::context(
+	[
+		'title' => 'Search results for ' . get_search_query(),
+	]
+);
+
+Timber::render( $templates, $context );

single.php

@@ -0,0 +1,20 @@
+<?php
+/**
+ * The Template for displaying all single posts
+ *
+ * @link https://developer.wordpress.org/themes/basics/template-hierarchy/
+ */
+
+namespace App;
+
+use Timber\Timber;
+
+$context   = Timber::context();
+$post      = $context['post'];
+$templates = [ 'templates/single-' . $post->post_type . '.twig', 'templates/single.twig' ];
+
+if ( post_password_required( $post->ID ) ) {
+	$templates = 'templates/single-password.twig';
+}
+
+Timber::render( $templates, $context );

src/StarterSite.php

@@ -0,0 +1,186 @@
+<?php
+
+/**
+ * StarterSite class
+ * This class is used to add custom functionality to the theme.
+ */
+
+namespace App;
+
+use Timber\Site;
+use Timber\Timber;
+use Twig\Environment;
+use Twig\TwigFilter;
+
+/**
+ * Class StarterSite.
+ */
+class StarterSite extends Site {
+
+
+
+	/**
+	 * StarterSite constructor.
+	 */
+	public function __construct() {
+		add_action( 'after_setup_theme', [ $this, 'theme_supports' ] );
+		add_action( 'init', [ $this, 'register_post_types' ] );
+		add_action( 'init', [ $this, 'register_taxonomies' ] );
+
+		add_filter( 'timber/context', [ $this, 'add_to_context' ] );
+		add_filter( 'timber/twig/filters', [ $this, 'add_filters_to_twig' ] );
+		add_filter( 'timber/twig/functions', [ $this, 'add_functions_to_twig' ] );
+		add_filter( 'timber/twig/environment/options', [ $this, 'update_twig_environment_options' ] );
+
+		parent::__construct();
+	}
+
+	/**
+	 * This is where you can register custom post types.
+	 */
+	public function register_post_types() {}
+
+	/**
+	 * This is where you can register custom taxonomies.
+	 */
+	public function register_taxonomies() {}
+
+	/**
+	 * This is where you add some context.
+	 *
+	 * @param array $context context['this'] Being the Twig's {{ this }}
+	 */
+	public function add_to_context( $context ) {
+		$context['foo']   = 'bar';
+		$context['stuff'] = 'I am a value set in your functions.php file';
+		$context['notes'] = 'These values are available everytime you call Timber::context();';
+		$context['menu']  = Timber::get_menu( 'primary_navigation' );
+		$context['site']  = $this;
+
+		return $context;
+	}
+
+	/**
+	 * This is where you can add your theme supports.
+	 */
+	public function theme_supports() {
+		// Register navigation menus
+		register_nav_menus(
+			[
+				'primary_navigation' => _x( 'Main menu', 'Backend - menu name', 'timber-starter' ),
+			]
+		);
+
+		// Add default posts and comments RSS feed links to head.
+		add_theme_support( 'automatic-feed-links' );
+
+		/*
+		 * Let WordPress manage the document title.
+		 * By adding theme support, we declare that this theme does not use a
+		 * hard-coded <title> tag in the document head, and expect WordPress to
+		 * provide it for us.
+		 */
+		add_theme_support( 'title-tag' );
+
+		/*
+		 * Enable support for Post Thumbnails on posts and pages.
+		 *
+		 * @link https://developer.wordpress.org/themes/functionality/featured-images-post-thumbnails/
+		 */
+		add_theme_support( 'post-thumbnails' );
+
+		/*
+		 * Switch default core markup for search form, comment form, and comments
+		 * to output valid HTML5.
+		 */
+		add_theme_support(
+			'html5',
+			[
+				'comment-form',
+				'comment-list',
+				'gallery',
+				'caption',
+			]
+		);
+
+		/*
+		 * Enable support for Post Formats.
+		 *
+		 * See: https://codex.wordpress.org/Post_Formats
+		 */
+		add_theme_support(
+			'post-formats',
+			[
+				'aside',
+				'image',
+				'video',
+				'quote',
+				'link',
+				'gallery',
+				'audio',
+			]
+		);
+
+		add_theme_support( 'menus' );
+	}
+
+	/**
+	 * This would return 'foo bar!'.
+	 *
+	 * @param string $text being 'foo', then returned 'foo bar!'
+	 */
+	public function myfoo( $text ) {
+		$text .= ' bar!';
+
+		return $text;
+	}
+
+	/**
+	 * This is where you can add your own functions to twig.
+	 *
+	 * @link https://timber.github.io/docs/v2/hooks/filters/#timber/twig/filters
+	 * @param array $filters an array of Twig filters.
+	 */
+	public function add_filters_to_twig( $filters ) {
+
+		$additional_filters = [
+			'myfoo' => [
+				'callable' => [ $this, 'myfoo' ],
+			],
+		];
+
+		return array_merge( $filters, $additional_filters );
+	}
+
+
+	/**
+	 * This is where you can add your own functions to twig.
+	 *
+	 * @link https://timber.github.io/docs/v2/hooks/filters/#timber/twig/functions
+	 * @param array $functions an array of existing Twig functions.
+	 */
+	public function add_functions_to_twig( $functions ) {
+		$additional_functions = [
+			'get_theme_mod' => [
+				'callable' => 'get_theme_mod',
+			],
+		];
+
+		return array_merge( $functions, $additional_functions );
+	}
+
+	/**
+	 * Updates Twig environment options.
+	 *
+	 * @see https://twig.symfony.com/doc/2.x/api.html#environment-options
+	 *
+	 * @param array $options an array of environment options
+	 *
+	 * @return array
+	 */
+	public function update_twig_environment_options( $options ) {
+		// $options['autoescape'] = true;
+
+		return $options;
+	}
+}

style.css

@@ -0,0 +1,5 @@
+/*
+ * Theme Name: My Timber 2.x Starter Theme
+ * Description: Starter Theme to use with Timber
+ * Author: Timber Team and You!
+*/

tests/bootstrap.php

@@ -0,0 +1,28 @@
+<?php
+
+use WorDBless\Load;
+
+if (! file_exists(dirname(__DIR__) . '/wordpress/wp-content')) {
+	mkdir(dirname(__DIR__) . '/wordpress/wp-content');
+}
+
+if (! file_exists(dirname(__DIR__) . '/wordpress/wp-content/themes')) {
+	mkdir(dirname(__DIR__) . '/wordpress/wp-content/themes');
+}
+
+copy(
+	dirname(__DIR__) . '/vendor/automattic/wordbless/src/dbless-wpdb.php',
+	dirname(__DIR__) . '/wordpress/wp-content/db.php'
+);
+
+$theme_base_name = basename(dirname(__DIR__));
+$src = realpath(dirname(dirname(__DIR__)) . '/' . $theme_base_name);
+$dest = dirname(__DIR__) . '/wordpress/wp-content/themes/' . $theme_base_name;
+
+if ( is_dir($src) && ! file_exists($dest) ) {
+	symlink($src, $dest);
+}
+
+require_once dirname(__DIR__) . '/vendor/autoload.php';
+
+Load::load();

tests/test-timber-starter-theme.php

@@ -0,0 +1,64 @@
+<?php
+
+use Timber\Timber;
+use WorDBless\BaseTestCase;
+
+class TestTimberStarterTheme extends BaseTestCase
+{
+
+	public function set_up()
+	{
+		switch_theme(basename(dirname(__DIR__)) . '/theme');
+
+		require dirname(__DIR__) . '/functions.php';
+
+		Timber::$dirname = array_merge((array) Timber::$dirname, ['../views']);
+		Timber::$dirname = array_unique(Timber::$dirname);
+
+		// WorDBless includes wp-settings.php
+		do_action('after_setup_theme');
+
+		parent::set_up();
+	}
+
+	function tear_down()
+	{
+		parent::tear_down();
+		switch_theme('twentytwenty');
+	}
+
+	function testTimberExists()
+	{
+		$context = Timber::context();
+		$this->assertTrue(is_array($context));
+	}
+
+	function testFunctionsPHP()
+	{
+		$context = Timber::context();
+		$this->assertEquals('App\StarterSite', get_class($context['site']));
+		$this->assertTrue(current_theme_supports('post-thumbnails'));
+		$this->assertEquals('bar', $context['foo']);
+	}
+
+	function testLoading()
+	{
+		$str = Timber::compile('partials/tease.twig');
+		$this->assertStringStartsWith('<article class="tease tease-" id="tease-">', $str);
+		$this->assertStringEndsWith('</article>', $str);
+	}
+
+	/**
+	 * Helper test to output current twig version
+	 */
+	function testTwigVersion()
+	{
+		$version = Timber::compile_string("{{ version }}", ['version' => Twig\Environment::VERSION]);
+		$this->assertEquals(Twig\Environment::VERSION, $version);
+	}
+
+	// function testTwigFilter() {
+	// 	$str = Timber::compile_string('{{ "foo"|myfoo }}');
+	// 	$this->assertEquals('foo bar!', $str);
+	// }
+}

views/layouts/base.twig

@@ -0,0 +1,43 @@
+<!DOCTYPE html>
+<html {{ site.language_attributes }}>
+    {% block head %}
+        {% include 'partials/head.twig' %}
+    {% endblock %}
+
+    <body class="{{ body_class }}">
+        {{ function('wp_body_open') }}
+        <a class="skip-link screen-reader-text" href="#content">{{ _e('Skip to content') }}</a>
+        <header class="header">
+            {% block header %}
+                <div class="wrapper">
+                    <h1 class="hdr-logo">
+                        <a class="hdr-logo-link" href="{{ site.url }}">{{ site.name }}</a>
+                    </h1>
+                    <nav id="nav-main" class="nav-main">
+                        {% include 'partials/menu.twig' with {
+                            items: menu.get_items
+                        } %}
+                    </nav>
+                    <!-- #nav -->
+                </div>
+            {% endblock %}
+        </header>
+
+        <section id="content" class="content-wrapper">
+            {% if title %}
+                <h1>{{ title }}</h1>
+            {% endif %}
+            <div class="wrapper">
+                {% block content %}
+                    Sorry, no content
+                {% endblock %}
+            </div>
+        </section>
+
+        {% block footer %}
+            {% include 'partials/footer.twig' %}
+        {% endblock %}
+        {{ function('wp_footer') }}
+        {% do action('get_footer') %}
+    </body>
+</html>

views/partials/comment-form.twig

@@ -0,0 +1,32 @@
+<div class="comment-form">
+    <h3>Add comment</h3>
+    <form class="comment-form" method="post" action="{{ site.link ~ '/wp-comments-post.php' }}">
+        {% if user %}
+            <input type="hidden" name="email" value="{{ user.email }}" />
+            <input type="hidden" name="author" value="{{ user.name }}" />
+            <input type="hidden" name="url" value="{{ user.link }}" />
+        {% else %}
+            <label>
+                Email<br />
+                <input required name="email" type="email" id="email" />
+            </label>
+            <label>
+                Name<br />
+                <input required name="author" type="text" />
+            </label>
+            <label>
+                Website<br />
+                <input name="url" type="url" />
+            </label>
+        {% endif %}
+        <label>
+            Comment<br />
+            <textarea placeholder="Leave a comment..." name="comment" cols="60" rows="3"></textarea>
+        </label>
+        <input name="comment_post_ID" value="{{ post.id }}" type="hidden" />
+        <input name="comment_parent" value="{{ comment.id|default('0') }}" type="hidden" />
+        <button type="submit" name="Submit" class="btn">Send</button>
+        <button type="reset">Cancel</button>
+        <p>Your comment will be revised by the site if needed.</p>
+    </form>
+</div>

views/partials/comment.twig

@@ -0,0 +1,19 @@
+<div class="blog-comment" id="blog-comment-{{ comment.id }}">
+    <h5 class="comment-author">{{ comment.author.name }} says</h5>
+    <div class="comment-content">{{ comment.content|wpautop }}</div>
+
+    <section class="comment-box">
+        {% include 'partials/comment-form.twig' %}
+
+        {% if post.comments %}
+            <h4>replies</h4>
+            <div class="comments">
+                {% for cmt in comment.children %}
+                    {% include 'partials/comment.twig' with {
+                        comment: cmt
+                    } %}
+                {% endfor %}
+            </div>
+        {% endif %}
+    </section>
+</div>

views/partials/footer.twig

@@ -0,0 +1 @@
+<footer id="footer">Copyright {{ 'now'|date('Y') }}</footer>

views/partials/head.twig

@@ -0,0 +1,9 @@
+<head>
+    <meta charset="{{ site.charset }}" />
+    <link rel="stylesheet" href="{{ site.theme.link }}/style.css" type="text/css" media="screen" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <link rel="author" href="{{ site.theme.link }}/humans.txt" />
+    <link rel="profile" href="http://gmpg.org/xfn/11" />
+    {% do action('get_header') %}
+    {{ function('wp_head') }}
+</head>

views/partials/menu.twig

@@ -0,0 +1,12 @@
+{% if menu %}
+    <ul>
+        {% for item in items %}
+            <li class="{{ item.classes|join(' ') }}">
+                <a target="{{ item.target }}" href="{{ item.link }}">{{ item.title }}</a>
+                {% include 'partials/menu.twig' with {
+                    items: item.children
+                } %}
+            </li>
+        {% endfor %}
+    </ul>
+{% endif %}

views/partials/pagination.twig

@@ -0,0 +1,44 @@
+{% if posts.pagination.pages is not empty %}
+    <nav class="pagination-block">
+        <ul class="pagination">
+            {# First #}
+            {% if (posts.pagination.pages|first) and posts.pagination.pages|first.current != true %}
+                <li class="first btn">
+                    <a href="{{ posts.pagination.pages|first.link }}">First</a>
+                </li>
+            {% else %}
+                <li class="first btn disabled"><button disabled>First</button></li>
+            {% endif %}
+
+            {# Previous #}
+            {% if posts.pagination.prev %}
+                <li class="prev btn"><a href="{{ posts.pagination.prev.link }}">Previous</a></li>
+            {% else %}
+                <li class="prev btn disabled"><button disabled>Previous</button></li>
+            {% endif %}
+
+            {# Pages #}
+            {% for page in posts.pagination.pages %}
+                {% if page.link %}
+                    <li><a href="{{ page.link }}" class="{{ page.class }}">{{ page.title }}</a></li>
+                {% else %}
+                    <li class="current"><span class="{{ page.class }}">{{ page.title }}</span></li>
+                {% endif %}
+            {% endfor %}
+
+            {# Next #}
+            {% if posts.pagination.next %}
+                <li class="next btn"><a href="{{ posts.pagination.next.link }}">Next</a></li>
+            {% else %}
+                <li class="next btn disabled"><button disabled>Next</button></li>
+            {% endif %}
+
+            {# Last #}
+            {% if (posts.pagination.pages|last) and posts.pagination.pages|last.current != true %}
+                <li class="last btn"><a href="{{ posts.pagination.pages|last.link }}">Last</a></li>
+            {% else %}
+                <li class="last btn disabled"><button disabled>Last</button></li>
+            {% endif %}
+        </ul>
+    </nav>
+{% endif %}

views/partials/tease-post.twig

@@ -0,0 +1,16 @@
+{% extends 'partials/tease.twig' %}
+
+{% block content %}
+    <h2 class="h2"><a href="{{ post.link }}">{{ post.title }}</a></h2>
+    <p>
+        {{
+            post.excerpt({
+                words: 5,
+                read_more: 'Keep reading'
+            })
+        }}
+    </p>
+    {% if post.thumbnail.src %}
+        <img src="{{ post.thumbnail.src }}" />
+    {% endif %}
+{% endblock %}

views/partials/tease.twig

@@ -0,0 +1,9 @@
+<article class="tease tease-{{ post.type }}" id="tease-{{ post.id }}">
+    {% block content %}
+        <h2 class="h2"><a href="{{ post.link }}">{{ post.title }}</a></h2>
+        <p>{{ post.excerpt }}</p>
+        {% if post.thumbnail %}
+            <img src="{{ post.thumbnail.src }}" />
+        {% endif %}
+    {% endblock %}
+</article>

views/templates/404.twig

@@ -0,0 +1,5 @@
+{% extends 'layouts/base.twig' %}
+
+{% block content %}
+    Sorry, we couldn't find what you're looking for.
+{% endblock %}

views/templates/archive.twig

@@ -0,0 +1,15 @@
+{% extends 'layouts/base.twig' %}
+
+{% block content %}
+    {% for post in posts %}
+        {% include ['partials/tease-' ~ post.type ~ '.twig', 'partials/tease.twig'] %}
+    {% endfor %}
+
+    {% include 'partials/pagination.twig' with {
+        pagination: posts.pagination({
+            show_all: false,
+            mid_size: 3,
+            end_size: 2
+        })
+    } %}
+{% endblock %}

views/templates/author.twig

@@ -0,0 +1,7 @@
+{% extends 'layouts/base.twig' %}
+
+{% block content %}
+    {% for post in posts %}
+        {% include ['partials/tease-' ~ post.type ~ '.twig', 'partials/tease.twig'] %}
+    {% endfor %}
+{% endblock %}

views/templates/index.twig

@@ -0,0 +1,16 @@
+{% extends 'layouts/base.twig' %}
+
+{% block content %}
+    <h2>{{ foo }}</h2>
+    {% for post in posts %}
+        {% include ['partials/tease-' ~ post.type ~ '.twig', 'partials/tease.twig'] %}
+    {% endfor %}
+
+    {% include 'partials/pagination.twig' with {
+        pagination: posts.pagination({
+            show_all: false,
+            mid_size: 3,
+            end_size: 2
+        })
+    } %}
+{% endblock %}

views/templates/page.twig

@@ -0,0 +1,12 @@
+{% extends 'layouts/base.twig' %}
+
+{% block content %}
+    <div class="content-wrapper">
+        <article class="post-type-{{ post.type }}" id="post-{{ post.id }}">
+            <section class="article-content">
+                <h1 class="article-h1">{{ post.title }}</h1>
+                <div class="article-body">{{ post.content }}</div>
+            </section>
+        </article>
+    </div>
+{% endblock %}

views/templates/search.twig

@@ -0,0 +1,18 @@
+{# see `templates/archive.twig` for an alternative strategy of extending templates #}
+{% extends 'layouts/base.twig' %}
+
+{% block content %}
+    <div class="content-wrapper">
+        {% for post in posts %}
+            {% include ['partials/tease-' ~ post.type ~ '.twig', 'partials/tease.twig'] %}
+        {% endfor %}
+
+        {% include 'partials/pagination.twig' with {
+            pagination: posts.pagination({
+                show_all: false,
+                mid_size: 3,
+                end_size: 2
+            })
+        } %}
+    </div>
+{% endblock %}

views/templates/single-password.twig

@@ -0,0 +1,17 @@
+{% extends 'layouts/base.twig' %}
+
+{% block content %}
+    <form class="password-form"
+        action="{{ site.link }}/wp-login.php?action=postpass"
+        method="post">
+        <label for="pwbox-{{ post.id }}">Password:</label>
+        <input class="password-box"
+            name="post_password"
+            id="pwbox-{{ post.id }}"
+            type="password"
+            placeholder="Password"
+            size="20"
+            maxlength="20" />
+        <input class="password-btn" type="submit" name="Submit" value="Submit" />
+    </form>
+{% endblock %}

views/templates/single.twig

@@ -0,0 +1,37 @@
+{% extends 'layouts/base.twig' %}
+
+{% block content %}
+    <div class="content-wrapper">
+        <article class="post-type-{{ post.type }}" id="post-{{ post.id }}">
+            <img src="{{ post.thumbnail.src|resize(1200, 300) }}" />
+            <section class="article-content">
+                <h1 class="article-h1">{{ post.title }}</h1>
+                <p class="blog-author">
+                    <span>By</span>
+                    <a href="{{ post.author.path }}">{{ post.author.name }}</a>
+                    <span>&bull;</span>
+                    <time datetime="{{ post.date|date('Y-m-d H:i:s') }}">{{ post.date }}</time>
+                </p>
+                <div class="article-body">{{ post.content }}</div>
+            </section>
+            <section class="comment-box">
+                <div class="comments">
+                    {% if post.comments %}
+                        <h3>comments</h3>
+                        {% for cmt in post.comments %}
+                            {% include 'partials/comment.twig' with {
+                                comment: cmt
+                            } %}
+                        {% endfor %}
+                    {% endif %}
+                </div>
+
+                {% if post.comment_status == 'closed' %}
+                    <p>comments for this post are closed</p>
+                {% else %}
+                    {% include 'partials/comment-form.twig' %}
+                {% endif %}
+            </section>
+        </article>
+    </div>
+{% endblock %}