Create Custom Twig Filter in under 2 min

A custom twig filter is required when the available twig filters cannot do the job for you. Base64 encoding and decoding for example, cannot be done using the built-in filters even though these functions exist in pure PHP. So how do you create a custom twig filter in Symfony?

Requirements: Symfony 3.4 and above

Create Custom Twig Filter

For the sake of an example, we will be creating 2 filters to base64 encode/decode a string.
The first step involves in creating a file, say customFilters.php in your project’s source directory (your-project/src/TwigExtension/customFilters.php) with the following content:

<?php 
// src/TwigExtension/customFilters.php 

namespace App\TwigExtension; 
use Twig\TwigFilter; 

class customFilters extends \Twig_Extension { 

    public function getFilters() { 
    return array( 
            new TwigFilter('base64_encode', array($this, 'base64_en')), // base64_encode => name of custom filter, base64_en => name of function to execute when this filter is called.
            new TwigFilter('base64_decode', array($this, 'base64_dec'))
        );
    }

    public function base64_en($input)
    {
       return base64_encode($input);
    }

    public function base64_dec($input)
    {
        return base64_decode($input);
    }

}

The above snippet is quite self-explanatory, so one could very well skip ahead. However, for the sake of completeness,
Custom Twig Filters

  • The customFilters class extends Twig Extension which gives us access to the getFilters() method
  • The getFilters() method returns an array of custom filters (as you might’ve guessed!)
  • Each item in this array is an instance of the TwigFilter class
  • While instantiating the TwigFilter class, we pass it 2 parameters

    1. The name of the twig filter
    2. An array that contains the name of the method that should be called while using the custom filter

    Example: new TwigFilter('base64_encode', array($this, 'base64_en')). Here, base64_encode is the name of our custom filter, and base64_en is the name of the method to be called.

  • Write the body of the method that you provided in the previous step (base64_en). The method will automatically get a parameter (we’ve named it $input). For example: public function base64_en($input) { ... } .
    The contents of this method could be whatever you intend to do with the passed input. We have just called php’s base64_encode() on the input.

And that’s it. No additional configuration is needed to be able to use your newly defined filter.

Calling the custom twig filter

The custom filter can now be called in your twig template like this

// templates/default/index.html.twig
<div>
  Original String: Hello World <br />
  Encoded String {{ 'Hello World' | base64_encode }}
</div>

And Viola, you have your base64 encoded string right there via your new Twig Filter!


The benefit of creating custom twig filters this way is also that you can create as many filters as needed in a single file and use them everywhere in your application.

References