onepage चेकआउट में नीचे शिपिंग विधियों में कस्टम ब्लॉक कैसे जोड़ें?

मैं शिपिंग विधियों के नीचे कस्टम ब्लॉक जोड़ना चाहता हूं और यह कस्टम ब्लॉक शिपिंग विधि के रूप में होना चाहिए। मुझे लगता है कि निम्नलिखित लाइन ऑफ कोड इसे जोड़ने के लिए मददगार है। लेकिन आगे बढ़ने का कोई विचार नहीं है।

<div id="onepage-checkout-shipping-method-additional-load">
                    <!-- ko foreach: getRegion('shippingAdditional') -->
                    <!-- ko template: getTemplate() --><!-- /ko -->
                    <!-- /ko -->
                </div>

magento2

— शिवकुमार के
स्रोत

1. मॉड्यूल की चेकआउट निर्भरता घोषित करें

एप्लिकेशन / कोड / namespace / ModuleName / etc / module.xml

<?xml version="1.0"?>

<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Module/etc/module.xsd">
    <module name="NameSpace_ModuleName" setup_version="0.0.1" active="true">
        <sequence>
            <module name="Magento_Checkout"/>
        </sequence>
    </module>
</config>

2. ओवरराइट चेकआउट लेआउट

एप्लिकेशन / कोड / namespace / ModuleName / देखें / दृश्यपटल / लेआउट / 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="steps" xsi:type="array">
                                    <item name="children" xsi:type="array">
                                        <item name="shipping-step" xsi:type="array">
                                            <item name="children" xsi:type="array">
                                                <item name="shippingAddress" xsi:type="array">
                                                    <item name="children" xsi:type="array">
                                                        <item name="shippingAdditional" xsi:type="array">
                                                            <item name="component" xsi:type="string">uiComponent</item>
                                                            <item name="displayArea" xsi:type="string">shippingAdditional</item>
                                                            <item name="children" xsi:type="array">
                                                                <item name="additional_block" xsi:type="array">
                                                                    <item name="component" xsi:type="string">NameSpace_ModuleName/js/view/checkout/shipping/additional-block</item>
                                                                </item>
                                                            </item>
                                                        </item>
                                                    </item>
                                                </item>
                                            </item>
                                        </item>
                                    </item>
                                </item>
                            </item>
                        </item>
                    </item>
                </argument>
            </arguments>
        </referenceBlock>
    </body>
</page>

3. जावास्क्रिप्ट यूआई घटक बनाएँ

Magento 2 चेकआउट जावास्क्रिप्ट में प्रबंधन (नॉकआउट के साथ) है। इसलिए आपको एक कस्टम जेएस कम्पेनेंट बनाने की आवश्यकता है। यह चेकआउट UI घटक और आपके कस्टम HTML टेम्पलेट के बीच लिंक बनाएगा।

एप्लिकेशन / कोड / namespace / ModuleName / देखें / दृश्यपटल / वेब / js / देखें / चेकआउट / शिपिंग / अतिरिक्त-block.js

परिभाषित ([
    'UIComponent'

], फ़ंक्शन (घटक) {
    'सख्त का उपयोग करें';

    वापसी घटक। कस्टम ({
        चूक: {
            साँचा: 'NameSpace_ModuleName / checkout / शिपिंग / अतिरिक्त-ब्लॉक'
        }
    });
});

4. HTML टेम्पलेट बनाएं

फिर चेकआउट में प्रदर्शित होने जा रहे HTML टेम्पलेट को बनाएं।

एप्लिकेशन / कोड / namespace / ModuleName / देखें / दृश्यपटल / वेब / टेम्पलेट / चेकआउट / शिपिंग / अतिरिक्त-block.html

<div class="checkout-block" id="block-custom">
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</p>
    <p>Cum sociis natoque penatibus et magnis dis parturient montes.</p>
</div>

5. कैश साफ़ करें

अंत में निम्नलिखित कमांड चलाएं:

php bin/magento cache:clean
php bin/magento setup:upgrade
chmod -R 777 var/*

पूर्ण उदाहरण डेमो मॉड्यूल यहां से डाउनलोड करें

— सोहेल राणा
स्रोत

वास्तव में आप भयानक हैं। मैथेंटो समुदाय के लिए कोई अंत नहीं है। सदाबहार है

— शिवकुमार के

क्या आपको ये त्रुटियां मिलीं?

Broken reference: No element found with ID 'checkout.header.wrapper'. [] [] Class SR\AdditionalShippingBlock\Model\CustomBlockConfigProvider does not exist [] [] [2016-04-13 10:15:06] main.CRITICAL: Invalid block type: Magento\Checkout\Block\Onepage [] []

— थियागो फिगुएइरो

अन्य नॉब के लिए टिप: मॉड्यूल को अंदर जाने की आवश्यकता है app/code/SR/AdditionalShippingBlock, न कि app/code/Magento/AdditionalShippingBlock।

— थियागो फिगुएइरो

@ राहेल राणा, मैं एक ही जगह पर टेक्स्टफील्ड के बजाय डायनेमिक ड्रॉपडाउन करना चाहूंगा, इसके लिए मुझे सुझाव दें। धन्यवाद।

— राकेश जेसादिया

क्या यह सच है? : S wtf

— OZZIE

प्रस्तुत फ़ाइल "checkout_index_index.xml" में एक छोटी सी गलती है। यह होना चाहिए

<?xml version="1.0"?>

नहीं

<xml version="1.0"?>

मिस फर्स्ट चार '?'

— मार्सिन कोरज़िस्टाका
स्रोत

यह सोहेल के जवाब पर एक प्रशंसा हो सकती थी। किसी भी मामले में फ़ाइल उसके रेपो में सही है github.com/sohelrana09/...

— थियागो Figueiro

हां बिल्कुल। लेकिन मेरे पास टिप्पणी करने के लिए 50 प्रतिष्ठा होनी चाहिए;

— मार्सीन कोरज़िस्का