Setup Twig for the web project in WampServer on Windows
PHP TwigTwig is a popular template engine for PHP programming. WampServer is a web development environment on Windows and it allows you to create web applications with Apache, PHP and MySQL. In this post, we will show you how to setup Twig in WampServer on Windows.
Install Composer
Go to the website of Composer, the dependency manager for PHP. Download and run the Composer's windows installer, Composer-Setup.exe. It will install the Composer 1.10.13 on your Windows. PHP 5.3.2 is the minimum requirement for Composer to run, while Twig 3.x needs at least PHP 7.2.5. Therefore, we can choose PHP 7.2.10. During the installation, it will ask you the PHP's installation path. If PHP is under the WampServer, you can select its path, for example:
C:\wamp64\bin\php\php7.2.10
By default, the Composer batch file, composer.bat
, is installed in the directory as below under Windows 10:
C:\ProgramData\ComposerSetup\bin
Once the installation is complete, the above path is added to the system's path so that we can run Composer in any directory through Windows command line.
Create a new web project on WampServer
It is simple to create a new web project on WampServer.
Go to the WampServer's root directory: C:\wamp64\www
.
Create a folder for your web project, for example: C:\wamp64\www\twig-test
.
Done!
Install Twig for your web project
To install Twig, we need open Command Prompt in Windows and
change the current directory to the new web project folder: twig-test
cd C:\wamp64\www\twig-test
After that, install Twig via Composer:
composer require "twig/twig:^3.0"
Then, Twig 3.0.5 is installed under the folder twig-test\vendor
.
Testing the Twig template
First, under the web project folder twig-test
, create a subfolder themes
for
template files. In this folder, we create the template file index.twig
as below.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<title>Testing the Twig Template</title>
</head>
<body>
<h1>Hello world</h1>
<p>I love {{ fruit }} !</p>
</body>
</html>
In line 9, fruit
is the variable passed to the template.
The double-curly-brace {{}}
is used to print out the value of the variable fruit
.
Second, under the folder twig-test
, create a PHP file test.php
to render the template.
<?php
require_once './vendor/autoload.php';
$loader = new \Twig\Loader\FilesystemLoader('./themes');
$twig = new \Twig\Environment($loader);
echo $twig->render('index.twig', array("fruit" => "watermelon"));
?>
In line 2, Composer's PHP file autoload.php
is included to map the Twig's namespaces to
real folders. In line 4, \Twig\Loader\FilesystemLoader
is then created to look up templates in the ./themes
directory.
A \Twig\Environment
object is initialized with default configurations in line 6.
Finally, the template file index.twig
is loaded and rendered in line 8 with an array as the parameter.
In the array array("fruit" => "watermelon")
, the varialbe fruit
and its value are defined.
To check the result, open an Internet browser and access the PHP file test.php
, for example,
in the address bar type http://localhost/twig-test/test.php
.
You will see that the template file is rendered and the variable value watermelon
is passed to the template.