Créer un filtre pour flouter vos images avec Liip Imagine Bundle pour Symfony ou Ibexa DXP

Pré-requis 

Cet exemple a été réalisée sur un projet Symfony avec la dépendance Liip Imagine Bundle et Image magick.

Pour Image magick, il est généralement sur vos environnements de développement et de production. 

Pour installer Liip imagine bundle, il vous suffit de lancer cette commande : 

        composer require liip/imagine-bundle
    

Créer un filtre blur 

La première étape est de créer un filtre blur dans le répertoire src/Imagine/Filter/Loader/BlurFilter.php

        <?php
namespace App\Imagine\Filter\Loader;

use Imagine\Image\ImageInterface;
use Liip\ImagineBundle\Imagine\Filter\Loader\LoaderInterface;

class BlurFilter implements LoaderInterface
{
    /**
     * @param ImageInterface $image
     * @param array $options
     * @return ImageInterface
     */
    public function load(ImageInterface $image, array $options = [])
    {
        $blur = (!empty($options)) ? $options[0] : 10;
        $image->effects()->blur($blur);

        return $image;
    }
}
    

Déclarer votre filtre blur

La seconde étape est de déclarer votre filtre dans votre fichier config/services.yaml : 

        services:
    app.filter.blur_filter:
        class: App\Imagine\Filter\Loader\BlurFilter
        tags:
            - { name: "liip_imagine.filter.loader", loader: 'ctcfilter/blur' }
    

Utilisez votre filtre dans les variations d'images

Troisième et dernière étape, utilisez votre filtre dans les variations d'images.

Nous vous proposons 2 approches : 

# Symfony

Si vous utilisez Symfony, vous pouvez utiliser votre filtre de cette façon : 

        liip_imagine:
    filter_sets:
        full_blur:
            filters:
                ctcfilter/blur: [10]
    

#IBEXA DXP

Si vous utilisez Ibexa DXP ou eZ Platform, vous pouvez utiliser votre filtre de cette façon : 

        ezplatform:
    system:
        default:
            image_variations:
                full_blur:
                    reference: ~
                    filters:
                        - { name: ctcfilter/blur, params: [10] }