# Spryker

#### Installation

Start up the Spryker shop and run:

```
composer require scaleflex/spryker-cloudimage
```

#### Configuration in the shop

To get the package running, register the "Scaleflex" namespace into the config\_default.php in the KernelConstants::CORE\_NAMESPACES

```
$config[KernelConstants::CORE_NAMESPACES] = [
    'Scaleflex',
    ...
];
```

Set these constants in the config, where it is needed. the BaseUrl and the ignoredUrlPaths need to be set according to the use case.

```
use Scaleflex\Shared\Cloudimage\CloudimageConstants;

$config[CloudimageConstants::TOKEN] = '{{YOUR_TOKEN}}';
$config[CloudimageConstants::BASE_URL] = 'http://yves.de.spryker.local';
$config[CloudimageConstants::IGNORED_URL_PATHS] = ['http://yves.de.spryker.local'];
```

#### Integration into the code

Register the Twig plugin in the Pyz\Yves\Twig\TwigDependencyProvider.php

```
/**
 * @return \Spryker\Shared\TwigExtension\Dependency\Plugin\TwigPluginInterface[]
 */
protected function getTwigPlugins(): array
{
    return [
        ...
        new CloudimageTwigPlugin(),
    ];
]
```

**Example**

Use the TwigFilter for the images. Here is an example of how to extend the Pyz\Yves\ShopUi\Theme\default\components\molecules\lazy-image.twig. Everywhere this molecule will use Cloudimage and apply a grey filter.

```
{% block body %}
    {% set data = data | merge({'imageSrc': data.imageSrc | cloudimage({}, {grey: 1}) }) %}
    ...
{% endblock %}
```

**How to use the plugin**

```
cloudimage({YOUR_OPERATIONS}, {YOUR_FILTERS})
```

Cloudimage documentation for the operations: <https://docs.cloudimage.io/transformations/image-operations>

Cloudimage documentation for the filters: <https://docs.cloudimage.io/transformations/image-filters>