1

I am trying to override shipping.html file to my custom module, but it's not working for me.

requirejs-config.js

var config = {
paths: {        
    'Magento_Checkout/template/shipping': "Vendor_Namespace/template/shipping",
}
};

shipping.html

<!--
/**
 * Copyright © Magento, Inc. All rights reserved.
 * See COPYING.txt for license details.
 */
-->

<li id="shipping" class="checkout-shipping-address" data-bind="fadeVisible: visible()">
    <div class="step-title" translate="'Shipping Address'" data-role="title" />
    <div id="checkout-step-shipping"
         class="step-content"
         data-role="content">

    <each if="!quoteIsVirtual" args="getRegion('customer-email')" render="" />
    <each args="getRegion('address-list')" render="" />
    <each args="getRegion('address-list-additional-addresses')" render="" />

    <!-- Address form pop up -->
    <if args="!isFormInline">
        <button type="button"
                class="action action-show-popup"
                click="showFormPopUp"
                visible="!isNewAddressAdded()">
            <span translate="'New Address'" />
        </button>
        <div id="opc-new-shipping-address"
             visible="isFormPopUpVisible()"
             render="shippingFormTemplate" />
    </if>

    <each args="getRegion('before-form')" render="" />

    <!-- Inline address form -->
    <render if="isFormInline" args="shippingFormTemplate" />
</div>
</li>

<!--Shipping method template-->
<li id="opc-shipping_method"
class="checkout-shipping-method"
data-bind="fadeVisible: visible(), blockLoader: isLoading"
role="presentation">
<div class="checkout-shipping-method">
    <div class="step-title"
         translate="'Shipping Methods'"
         data-role="title" />

    <each args="getRegion('before-shipping-method-form')" render="" />

    <div id="checkout-step-shipping_method"
         class="step-content"
         data-role="content"
         role="tabpanel"
         aria-hidden="false">
        <form id="co-shipping-method-form"
              class="form methods-shipping"
              if="rates().length"
              submit="setShippingInformation"
              novalidate="novalidate">

            <render args="shippingMethodListTemplate"/>

            <div id="onepage-checkout-shipping-method-additional-load">
                <each args="getRegion('shippingAdditional')" render="" />
            </div>
            <div role="alert"
                 if="errorValidationMessage().length"
                 class="message notice">
                <span text="errorValidationMessage()" />
            </div>
            <div class="actions-toolbar" id="shipping-method-buttons-container">
                <div class="primary">
                    <button data-role="opc-continue" type="submit" class="button action continue primary">
                        <span translate="'Next'" />
                    </button>
                </div>
            </div>
        </form>
        <div class="no-quotes-block">
             <!-- ifnot="rates().length > 0"
             translate="'Sorry, no quotes are available for this order at this time'" >-->
            <button type="submit" class="button"><span translate="'Request a quote'" /></button>
         </div>
    </div>
    </div>
    </li>
  • Please mention path of your shipping.html – Saphal Jha May 21 at 7:24
  • app/code/vendor/namespace/view/frontend/web/template/shipping.html – Pratik ojha May 21 at 7:39
  • @Pratikojha did you try my answer below? – fmsthird May 21 at 7:49
  • @magefms yes i did, but not worked for me. is there any xml that is also reuired to override for this? – Pratik ojha May 21 at 8:00
  • what are you trying to achieve? your expected output? why do you want to override it? – fmsthird May 21 at 8:06
0

Rewrite your requirejs-config like below:

var config = {
    "map": {
       "*": {       
        'Magento_Checkout/template/shipping': "Vendor_Namespace/template/shipping"
       }
    }
}
0

You have 2 ways to achieve that:

1) Using theme :

app/design/frontend/Vendorname/Theme/Magento_Checkout/web/template/shipping.html

2) Using extension :

app/code/VendorName/ModuleName/view/frontend/web/template/shipping.html

app/code/VendorName/ModuleName/view/frontend/requirejs-config.js

var config = {
    paths: {
        'Magento_Checkout/template/shipping': 'VendorName_ModuleName/template/shipping'
    }
};
  • but i have to do using extension, please tell me is there any other required file for this. – Pratik ojha May 21 at 7:43
  • I don't think so, have you clear the cache, pub/static and generated folder? – Saphal Jha May 21 at 8:27
  • yes i tried everything. – Pratik ojha May 21 at 8:53

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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