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

Here, in this Topic, the following steps will explain to you to Include More Variable to Window.checkoutConfig in Magento 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.

Get your free Magento development consultation !!!

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.checkoutConfig in Magento platform Checkout. Each store has a Magento checkout with various features; this is one of the most accepted Variable to Window.checkoutConfig in Magento 2 page you must be well-known with.

Last Update: February 6, 2021  

March 16, 2018   3528   Nandini Ramachandran    Magento Checkout, Operations    
Total 1 Votes:
0

Tell us how can we improve this post?

+ = Verify Human or Spambot ?

Leave a Reply

Your email address will not be published. Required fields are marked *

Facebook
Twitter
INSTAGRAM
LinkedIn