By Default, In Magento2 Billing address is displayed with the Payment method, and the second option to display billing address is on the Payment page.
If you have a custom requirement like, Display the Billing address before all the payment methods you need to do customization for that.
Create a di.xml file at the location,
app/code/Magemonkeys/BillingAddressBeforePayment/etc/frontend/di.xml
|
1 2 3 4 5 6 7 8 9 |
<?xml version="1.0"?> <config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:ObjectManager/etc/config.xsd"> <!-- Set Billing address above the payment method plugin --> <type name="Magento\Checkout\Block\Checkout\LayoutProcessor"> <plugin name="move_billing_address_above_payment_method" type="Magemonkeys\BillingAddressBeforePayment\Plugin\Block\Checkout\LayoutProcessor"/> </type> </config> |
Based on the XML file, Create a Plugin Class, app/code/Magemonkeys/BillingAddressBeforePayment/Plugin/Block/Checkout/LayoutProcessor.php
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 |
<?php declare(strict_types=1); namespace Magemonkeys\BillingAddressBeforePayment\Plugin\Block\Checkout; use Magento\Checkout\Block\Checkout\LayoutProcessor as CheckoutLayoutProcessor; /** * Move Billing address to top */ class LayoutProcessor { /** * @param CheckoutLayoutProcessor $subject * @param array $jsLayout * @return array */ public function afterProcess( CheckoutLayoutProcessor $subject, array $jsLayout ): array { $paymentLayout = $jsLayout['components']['checkout']['children']['steps'] ['children']['billing-step']['children']['payment']['children']; if (isset($paymentLayout['afterMethods']['children']['billing-address-form'])) { $jsLayout['components']['checkout']['children']['steps'] ['children']['billing-step']['children']['payment']['children'] ['beforeMethods']['children']['billing-address-form'] = $paymentLayout['afterMethods']['children']['billing-address-form']; unset($jsLayout['components']['checkout']['children']['steps'] ['children']['billing-step']['children']['payment'] ['children']['afterMethods']['children']['billing-address-form']); } return $jsLayout; } } |
before method is used to display content before the payment methods.
Clear the cache and go to the checkout page to see the billing address. It will be at the top of the payment page.
[crayon-633c367b544b2613614505/] Using above fucntion Images can be imported directly from...
Override view block using di.xml and add the below code...
You can check a list of called layout XML for...
Follow the below steps to install and set up PWA...
If you want to remove all leading zero's from order,...
