How to include Variable to Window.Checkout Config in Magento Checkout?

Here, in this Topic, the following steps will explain to you to Include More Variables in the Window.checkout Config in Magento 2 Checkout:

In your module, please create an etc/frontend/di.xml file

Form the AdditionalConfigProvider.php in the Model folder

Restore the cache from the admin page.

Build your Amazon-like multi-vendor marketplace website @ $249/- now!!!

              Get your free live demo now: Click here

Include Variable to Window. Checkout Config in Magento 2 Checkout?

Hello friends,

The checkout page of Magento 2 is intensely dissimilar from the check-in/out page in Magento 1. Actually, it uses knockout JS to build client-side and REST API to build the server-side. Magento uses the global variable to find the data from the server, in the check-in/out a page of Magento 2, window.checkoutConfig. KoJS uses this data to calculate and display the information.

In this article, I will explain to you how to include more variables in the window.checkoutConfig by using the dependency injection (di). So you can make some own adjust to Magento checkout in the future.

Step 1:

In your module, please form etc/frontend/di.xml file:

<?xml version="1.0"?>

<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"

       xsi:noNamespaceSchemaLocation="urn:magento:framework:ObjectManager/etc/config.xsd">

   <type name="Magento\Checkout\Model\CompositeConfigProvider">

       <arguments>

           <argument name="configProviders" xsi:type="array">

               <item name="additional_provider" xsi:type="object">Webnexs\Training\Model\AdditionalConfigProvider</item>

           </argument>

       </arguments>

   </type>

</config>

Step 2:

Please form the AdditionalConfigProvider.php in the model folder

<?php

namespace Webnexs\Training\Model;

class AdditionalConfigProvider implements \Magento\Checkout\Model\ConfigProviderInterface

{

   public function getConfig()

   {

       $output['test_config'] = 'Test Config';

       return $output;

   }

}

Step 3:

Try to restore the cache on the admin page.

You can check the result by including the product and go to the checkout page. Please open the console of the browser and enter the following command:

console.log(window.checkoutConfig.test_config);

Or only window.checkoutConfig.test_config

If the result is ‘Test Config’, you have included the variable to checkoutConfig successfully Now you can use this variable for your purpose.

I hope these above-mentioned steps help you to Include More Variables in the Window.checkout Config in Magento platform Checkout. Each store has a Magento checkout with various features; this is one of the most accepted Variables to Window.checkout Config in Magento 2 page you must be well-known with.

So if you’re looking to build an online store with Magento, click here to get started!!!