2

I want to add my custom template on checkout page in order summary just after Total as shown in screenshot :

enter image description here

In this template .phtml file I want to add some conversion depend on payment gateway just to display only to customer.

How can I do that?

7
  • We cannot include the phtml because the checkout Page used Knockout html template. We should build the js to get the result. Commented Nov 22, 2017 at 5:11
  • @KhoaTruongDinh, please post how can I build js for my requirement. Commented Nov 22, 2017 at 5:18
  • The problem is here: depend on payment gateway. So, when the client chooses the payment, the custom total will re-calculate? Commented Nov 22, 2017 at 5:28
  • As I said I just want to display the price which will be show on payment gateway to customer, payment gateway conversion is done in its module already, don't want to update cart total and anything else. Commented Nov 22, 2017 at 5:31
  • @KhoaTruongDinh, Can you please suggest how can I use ajax in .html file ? Commented Nov 22, 2017 at 6:08

1 Answer 1

3

If we take a look the Json config of xml layout on checkout page:

enter image description here

As we can see, we can add the custom content to itemsBefore area.

For example code:

app/code/Vendor/Checkout/view/frontend/layout/checkout_index_index.xml

<?xml version="1.0"?>

<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <referenceBlock name="checkout.root">
            <arguments>
                <argument name="jsLayout" xsi:type="array">
                    <item name="components" xsi:type="array">
                        <item name="checkout" xsi:type="array">
                            <item name="children" xsi:type="array">
                                <item name="sidebar" xsi:type="array">
                                    <item name="children" xsi:type="array">
                                        <item name="summary" xsi:type="array">
                                            <item name="children" xsi:type="array">
                                                <item name="itemsBefore" xsi:type="array">
                                                    <item name="children" xsi:type="array">
                                                        <item name="testcustom" xsi:type="array">
                                                            <item name="component" xsi:type="string">Vendor_Checkout/js/view/summary/custom</item>
                                                        </item>
                                                    </item>
                                                </item>
                                            </item>
                                        </item>
                                    </item>
                                </item>
                            </item>
                        </item>
                    </item>
                </argument>
            </arguments>
        </referenceBlock>
    </body>
</page>

app/code/Vendor/Checkout/view/frontend/web/js/view/summary/custom.js

define(
    [
        'uiComponent'
    ],
    function (Component) {
        'use strict';
        return Component.extend({
            defaults: {
                template: 'Vendor_Checkout/summary/custom'
            }
        });
    }
);

app/code/Vendor/Checkout/view/frontend/web/template/summary/custom.html

<div>Test Test Here</div>
10
  • Can I add .phtml file in place of .html file? Commented Nov 22, 2017 at 4:03
  • I do not try but I think we cannot. Try to use html and use Cms content. Commented Nov 22, 2017 at 4:32
  • I tried but not working, I need to load cart session here and some calculation, Please suggest How can I add .phtml below Total? Commented Nov 22, 2017 at 4:35
  • I tried but not working? The message did not show? I'm pretty sure it will show. Commented Nov 22, 2017 at 4:40
  • I meant to say .html is working properly, but when I tried with .phtml it is not working. And I need to add .phtml file not html as I have to do some php calculation here. Commented Nov 22, 2017 at 4:43

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.