2

I want to customize the shipping form, but I don't know how to find that form, I tried but I did not find it!

Comment BY USER

I only want how can i edit this page, i want edit the shipping form. Add a field like number phone or delete the company field... I didnt tried nothing

My shipping form

2
  • 1
    Oriol, please don't post a single line comment. Please put what you have tried so far?
    – Amit Bera
    Commented Sep 13, 2018 at 9:16
  • I only want how can i edit this page, i want edit the shipping form. Add a field like number phone or delete the company field... I didnt tried nothing
    – Oriol
    Commented Sep 13, 2018 at 9:22

2 Answers 2

3

Removing a field or changing order can be done using XML, create a layout file in your local theme like:

app/design/frontend/Vendor/Theme/Magento_Checkout/layout/checkout_index_index.xml

and add one of the following options to a field:

<item name="sortOrder" xsi:type="string">100</item>

<item name="visible" xsi:type="boolean">false</item>

your checkout_index_index.xml will look like this:

<?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="shipping-address-fieldset" xsi:type="array">
                                                            <item name="children" xsi:type="array">
                                                                <item name="company" xsi:type="array">
                                                                    <item name="visible" xsi:type="boolean">false</item>
                                                                </item>
                                                            </item>
                                                        </item>
                                                    </item>
                                                </item>
                                            </item>
                                        </item>
                                    </item>
                                </item>
                            </item>
                        </item>
                    </item>
                </argument>
            </arguments>
        </referenceBlock>
    </body>
</page>
1

This template is called in :

vendor/magento/module-checkout/view/frontend/templates/onepage.phtml

<!-- ko template: getTemplate() --><!-- /ko -->

This template is binded via Knockoutjs

vendor/magento/module-checkout/view/frontend/web/template/shipping-address/form.html

vendor/magento/module-checkout/view/frontend/web/template/shipping.html

Now if you want to add some div or classes, you can added them but you have to copy first that files in your current theme, not in the path's noted above !

If you Want to add some custom field (I guess), you have to follow Magento DevDocs procedure

1
  • How to add div class in it? Commented Apr 3 at 17:28

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.