Tags Move Apply Coupon to Order Summary Magento tutorial to move apply coupon to order summary magento tutorial for developers magento tutorial ecommerce guide

Today's tutorial will explain how to move the apply coupon field to the order summary sidebar in Magento 2. Magento offers default checkout and cart pages but at some point, it is required to move some fields to other fields instead of default designs.

Let's follow these steps:

Steps to Move Apply Coupon To Order Summary in Magento 2:

1) First of all, Let’s assume that you have created a simple module. Now, you need to create checkout_cart_index.xml file at app/code/MageDelight/CustomCheckout/view/frontend/layout/ and paste the below code:

<?xml version="1.0"?>
<!--
-->
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="1column" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <referenceBlock name="checkout.cart.coupon" remove="true"/>
        <block class="Magento\Checkout\Block\Cart\Coupon" name="checkout.cart.coupon2" as="coupon" template="Magento_Checkout::cart/coupon.phtml"/>
        <move element="checkout.cart.coupon2" destination="cart.summary" before="checkout.cart.shipping"/>
    </body>
</page>

2) Now, Just need to clean the cache and check the output.

That’s it !!!

This is the easy way to move the apply coupon to the order summary in Magento 2. Hope this tutorial helped you get it done rightly. If we missed out anything, feel free to get in touch with us.

Also read: How to Create Coupon Codes in Magento 2?