This course will be retired on June 1, 2025.

Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll

Templating with Twig

Preview

Start a free Courses trial
to watch this video

Sign up for Treehouse

Installing Twig

4:43 with Alena Holligan

Twig is most commonly installed using Composer. It can be installed as its own package in a standalone project, or many frameworks allow you to choose Twig as your preferred templating engine. Sometimes frameworks may have specific packages to better communicate with Twig.

Twig Documentation

Setting up Twig

Writing Templates

Installing Twig as a Standalone

The recommended way to install Twig is via Composer:

composer require "twig/twig:^2.0"

Basic API Usage

This section gives you a brief introduction to the PHP API for Twig.

<?php
require_once '/path/to/vendor/autoload.php';

$loader = new Twig_Loader_Array([
    'index' => 'Hello {{ name }}!',
]);
$twig = new Twig_Environment($loader);

echo $twig->render('index', ['name' => 'Fabien'])

Installing Twig with Slim

The slim/twig-view component allows you to render Twig templates instead of PHP templates in your application.

Step 1: Install slim/twig-view. The easiest way is through composer.

composer require slim/twig-view

Step 2: Next, you need to change the registered view component on the Slim app’s container like this:

// Get container
$container = $app->getContainer();

// Register component on container (your view or renderer)
$container['view'] = function ($c) {
    $settings = $c->get('settings')['renderer'];
    $view = new \Slim\Views\Twig($settings['template_path']);
    return $view;
};

Related Discussions

Have questions about this video? Start a discussion with the community and Treehouse staff.

Sign up

    Related Discussions

    Have questions about this video? Start a discussion with the community and Treehouse staff.

    Sign up

    If you search for twig templating, you'll see twig.symfony.com. 0:00
    When we go to Install Now, we'll 0:07
    see that the recommended way to install Twig is via Composer. 0:11
    If I stroll up just a little bit. 0:15
    We'll see a Prerequisite. 0:19
    Twig needs at least PHP 7.0.0 to run. 0:21
    This shouldn't be problem since you should be running a later version of 7. 0:26
    But just be aware for older code bases or servers that may not have been upgraded. 0:30
    Let's copy the composer line to run the install. 0:37
    I'm going cd into my documents Twig folder. 0:42
    And then, I'm going to run compose require twig/twig. 0:47
    Now, I can open my project in my ID or text editor. 0:53
    I'm going to start with the index.php file within a public folder. 0:57
    Public/index.php. 1:04
    Let's close a couple of these files. 1:09
    I'm ready. 1:13
    Let's go back to the Twig site, and grab their basic usage code. 1:14
    We'll copy this and go back into index.php. 1:20
    We'll paste the code, and then make sure we open our php tags. 1:24
    This first line is a call to the autoloader, so 1:30
    let's point that to the composer autoload file. 1:33
    __DIR__ /.. 1:41
    To go up one level, and then vendor/autoload.php. 1:47
    Now, let's choose MAPM, to run this code in a browser. 1:52
    Go into preferences, and 1:57
    make sure your server has selected Documents 2:00
    twig public where the index.php file is. 2:05
    And then, we can start our servers. 2:10
    Now, we're ready to visit the local site in a browser. 2:13
    We see hello Fabien. 2:19
    Let's go back to our code and see what's going on. 2:21
    After the autoload, the first line of the program is to load the temple. 2:24
    The template is actually coded directly into this file. 2:30
    Which probably isn't what we want, but it worked for a simple output. 2:34
    Let's go back to the Twig site. 2:38
    The second example points Twig to a template directory. 2:41
    Let's copy that line and setup a template directory. 2:45
    We'll create a new folder outside of the public folder called templates. 2:52
    Then we'll replace our loader. 2:59
    And change our path. 3:01
    Now, we'll create a new file. 3:09
    In our templates directory New File name hello.twig. 3:12
    In here we'll add the string for our original loader. 3:18
    Hello, name, Exclamation. 3:21
    Finally, in order for our render to work, we need to tell it to use hello.twig. 3:29
    Render, instead of index, we want to use hello.twig. 3:37
    Now, let's check this out in the browser again. 3:43
    Great, we get the same Hello Fabian page. 3:49
    Not giving us much yet, but let's start with some HTML and 3:53
    CSS that I've prepared for you in the notes and downloads. 3:57
    I've included a CSS folder that should go in the public directory. 4:02
    And I've also included a home.twig file that should go in your templates 4:07
    directory. 4:12
    If you scroll down, you can see that I've started with the same greeting. 4:15
    But I've added a lot more HTML. 4:19
    Once again, I need to change my render. 4:22
    In the index.php file instead of hello we'll use home.twig. 4:24
    Now, I'm ready to refresh my browser. 4:31
    Besides the greeting, we now have the styles for 4:34
    our page with a header and a footer. 4:37
    We're ready to start working with some of the basic syntax of Twig. 4:39

    You need to sign up for Treehouse in order to download course files.

    Sign up

      You need to sign up for Treehouse in order to set up Workspace

      Sign up