Magento 2 External checkout for PWA

We’ve developed a Magento 2 extension which creates a seamless experience between your Vue Storefront catalog and your Magento 2 checkout. This will give you some flexibility in choosing the checkout and payment providers that fit your customers needs.

New Magento 2 extension for Vue Storefont: Easier configuration for integration with the Magento checkout


Redirecting your visitors to the Magento checkout instead of using the default Vue Storefront checkout gives you a lot of flexibility in some cases. We’ve developed a Magento 2 extension which creates a seamless experience between your Vue Storefront catalog and your Magento 2 checkout. Divante already created an integration between the Vue Storefont cart and the Magento checkout, but we felt the user experience could be slightly better. That’ why we created this extension.

checkout-extension

Our extension gives some extra possibilities on top of the Divante integration

As you can see you can use this extension to allow only certain URLs and certain layout handles. That way you can make sure the end user only gets access to the checkout and not to other pages of the Magento installation. Users are also redirected back to the Vue Storefront PWA when clicking the store logo or trying to access blocked pages.

Using this extension you can choose a checkout of your own, linking or make modifications in a familiar environment. This way you also get a lot more choice in payment service providers.

See how it works

ezgif.com-gif-maker-1

Our extension makes sure Vue Storefront adaption gets easier for agencies. That’s why we decided to open source it. In the case above we used the following extensions for the checkout.

Used extensions:


Advantages of using the extension:

  • Instead of being redirected to the Magento 2 success page, the end user is redirected to a Vue Storefront success page, which also clears the cart content after completing the order. So the end user starts with a clean shopping session after a successful payment.
  • You still have the awesome advantages of the PWA frontend for browsing the catalog and other pages.
  • Gives you a lot of flexibility on top of the existing Divante integration.
  • Very easy to customize. Choose your own desired checkout.
  • Open source and maintained module.

For more information checkout the Github repo.

Would you like to know more about PWA?

With PWA you get best of both, a web and app in one application. This way you can offer your customers the best user-experience on all devices. Would you like to know more? You can read our blog about our journey with PWA or check out our own PWA demostore . You can always contact us for more information!

Author