Colissimo integration

This page contains information about the different ways you can accept shippings with Colissimo in your Front-Commerce application.


No matter the backend solution, the Colissimo Front-Commerce modules requires a Map component to display pickup points. Thus, before proceeding, please make sure that you’ve chosen a Map implementation from Display a map.

Integrate with Magento2

Since version 2.5.0

The integration of Colissimo in Magento 2 & Front-Commerce relies on Magentix’s module for pickup points. If you don’t need pickup points, any module should be supported by default.

Then, within your Front-Commerce project, you have to:

  • Use the module in your .front-commerce.js
// .front-commerce.js
module.exports = {
  name: "Front Commerce DEV",
  url: "http://www.front-commerce.test",
  modules: [
+  "./node_modules/front-commerce/modules/shipping-colissimo-magento2"
  serverModules: [
    { name: "FrontCommerce", path: "server/modules/front-commerce" },
    { name: "Magento2", path: "server/modules/magento2" },
+    {
+      name: "Colissimo",
+      path: "shipping-colissimo-magento2/server/modules/colissimo",
+    },
  webModules: [
    { name: "FrontCommerce", path: "./src/web" },
  • Import styles of Colissimo by overriding the _modules.scss
// src/web/theme/modules/_modules.scss

+@import "~theme/modules/Colissimo/Colissimo";
// src/web/theme/modules/Checkout/ShippingMethod/AdditionalShippingInformation/getAdditionalDataComponent.js

+import Colissimo from "theme/modules/Colissimo";

const ComponentMap = {
+  colissimo: {
+    pickup: Colissimo,
+  },

After following this guide, customers will be able to choose Colissimo as a shipping method and will be able to choose a pickup point on a map.

Edit on GitHub  or  Send us a feedback