Vue Storefront External Checkout

With this extension you can use your CMS checkout (e.g. Magento) instead of default Vue Storefront checkout. This plugin requires cart and user sync on your backend (see integrations )

See live demo - add something to your cart and proceed to checkout.

Current CMS integrations for this extension

• Magento 2

How it works?

When user tries to enter your Vue Storefront checkout:

1. The extension synchronizes cart and user data with your backend CMS
2. User is redirected to your CMS checkout (extension overrides /checkout route).

Installation

1. Install the extension on your Vue Storefront instance

yarn install vsf-external-checkout --save

2. Add CMS address to your config/local.json file.

"externalCheckout": {
  "cmsUrl" : "https://yourcmsaddress.com"
}

3. Enable cart synchronization for your Vue Storefront instance in config/local.json

cart": {
  "synchronize": true,
  ...
}

4. Register the extension in src/extensions/index.js file

export default [
  // other extensions
  require('vsf-external-checkout/index.js'),
]

How to use for a specific stores in a multistore setup

You can specify which storeviews should use the external checkout by adding each store code to your config/local.json file.

"externalCheckout": {
  "cmsUrl" : "https://yourcmsaddress.com",
  "stores": {
    "se": {
      "cmsUrl": "https://yourcmsaddress.com"
    },
    "dk": {
      "cmsUrl": "https://yourcmsaddress.com"
    }
  }
}

How to integrate with other CMS

If you want to integrate this extension with your backend CMS make sure that entering {your_CMS_url}/vue/cart/sync/token/{user-token}/cart/{cart_token} will do the following:

1. Synchronzie cart and user data between Vue Storefront and your CMS
2. Redirect user to external checkout