Colissimo plugin for Sylius.


Latest Version Software License


This sylius plugin allows you to manage parcel shipments with colissimo. You can define delivery methods such as colissimo pickup points or colissimo home delivery.

For pickup point deliveries, an interactive map with the list of pickup points is generated according to the delivery address entered the tunnel by the user.


TODO add screenshots


Step 1: Install and enable plugin

Open a command console, enter your project directory and execute the following command to download the latest stable version of this plugin:

$ composer require cleverage/sylius-colissimo-plugin

This command requires you to have Composer installed globally, as explained in the installation chapter of the Composer documentation.

Add bundle to your config/bundles.php:

# config/bundles.php

return [
    // ...
    CleverAge\SyliusColissimoPlugin\CleverAgeSyliusColissimoPlugin::class => ['all' => true],
    // ...

Step 2: Import routing and configs

Import routing

# config/routes/clerverage_sylius_colissimo.yaml
  resource: "@CleverAgeSyliusColissimoPlugin/Resources/config/shop_routing.yml"

  resource: "@CleverAgeSyliusColissimoPlugin/Resources/config/admin_routing.yml"
  prefix: /admin

Import application config

# config/packages/_sylius.yaml
  - { resource: "@CleverAgeSyliusColissimoPlugin/Resources/config/config.yaml" }

Step 3: Update templates

Admin section

Add the following to the admin template SyliusAdminBundle/ShippingMethod/_form.html.twig

<h4 class="ui dividing header">{{ 'clever_age.admin.ui.shipping_method.title'|trans }}</h4>
{{ form_row(form.colissimoPickup) }}
{{ form_row(form.colissimoHomeDelivery) }}

See an example here.

Next add the following to the admin template SyliusAdminBundle/Order/Show/_shipment.html.twig after shipment header:

{% include "CleverAgeSyliusColissimoPlugin/Shipment/Label/pickupPoint.html.twig" %}

See an example here.

Shop section

Add the following to the shop template SyliusShopBundle/Checkout/SelectShipping/_choice.html.twig

// ...
{% if method.isColissimoPickup %}
    {% include '@CleverAgeSyliusColissimoPlugin/Shipment/selectedPickupPoint.html.twig' %}
{% endif %}
// ...
{% if method.isColissimoPickup %}
    {% include '@CleverAgeSyliusColissimoPlugin/Shipment/map.html.twig' with {
        'pickupPoints': [myPickupPoints]
    } %}
{% endif %}

See an example here.

Next add the following to the shop template SyliusShopBundle/Common/Order/_shipments.html.twig after shipment method header:

{% include "@CleverAgeSyliusColissimoPlugin/Shipment/Label/pickupPoint.html.twig" %}

See an example here.

Step 4 : Update styles, scripts and install assets

Add the following to the shop template SyliusShopBundle/_styles.html.twig

{% include '@SyliusUi/_stylesheets.html.twig' with { 'path': 'bundles/cleveragesyliuscolissimoplugin/css/map.css' } %}
{% include '@SyliusUi/_stylesheets.html.twig' with { 'path': 'bundles/cleveragesyliuscolissimoplugin/css/popup.css' } %}

{# Important for the map ! #}
<link rel="stylesheet" href=""

See an example here.

Next the following to the shop template SyliusShopBundle/_scripts.html.twig

<script src="{{ asset('bundles/cleveragesyliuscolissimoplugin/js/map.js') }}" type="module"></script>
{% include '@SyliusUi/_javascripts.html.twig' with { 'path': 'bundles/cleveragesyliuscolissimoplugin/js/select-pickup-point.js' } %}
{% include '@SyliusUi/_javascripts.html.twig' with { 'path': 'bundles/cleveragesyliuscolissimoplugin/js/change-pickup-point.js' } %}
{% include '@SyliusUi/_javascripts.html.twig' with { 'path': 'bundles/cleveragesyliuscolissimoplugin/js/select-shipping.js' } %}

See an example here.

Install assets

bin/console assets:install --symlink

Step 5 : Customize resources

Shipping method resource

If you haven't extended the shipping method resource yet, here is what it should look like :

// src/Entity/ShippingMethod.php


namespace App\Entity;

use Doctrine\ORM\Mapping as ORM;
use CleverAge\SyliusColissimoPlugin\Model\ShippingMethodInterface;
use CleverAge\SyliusColissimoPlugin\Model\ShippingMethodTrait;
use Sylius\Component\Core\Model\ShippingMethod as BaseShippingMethod;

 * @ORM\Entity()
 * @ORM\Table(name="sylius_shipping_method")
class ShippingMethod extends BaseShippingMethod implements ShippingMethodInterface
    use ShippingMethodTrait;

Order resource

If you haven't extended the order resource yet, here is what it should look like :

// src/Entity/Order.php


namespace App\Entity;

use CleverAge\SyliusColissimoPlugin\Model\OrderInterface;
use CleverAge\SyliusColissimoPlugin\Model\OrderTrait;
use Doctrine\ORM\Mapping as ORM;
use Sylius\Component\Core\Model\Order as BaseOrder;

 * @ORM\Entity()
 * @ORM\Table(name="sylius_order")
class Order extends BaseOrder implements OrderInterface
    use OrderTrait;

You can read about extending resources here.

Update shipping and order resources config

Next you need to tell Sylius that you will use your own extended resources :

# config/packages/_sylius.yaml

        model: App\Entity\ShippingMethod

        model: App\Entity\Order

Step 6 : Update database schema

bin/console doctrine:migrations:diff
bin/console doctrine:migrations:migrate 

Step 7 : Configure plugin

// config/packages/cleverage_sylius_colissimo.yaml

  encryptionKey: 'your encryption key'

Enjoy now !