I need to edit the city field HTML of New shipping address form on checkout in Magento 2.

I am not getting the file from where we can change this or add some classes in these fields. Please share some idea to achieve this.

2 Answers 2



<type name="Magento\Checkout\Block\Checkout\AttributeMerger">
    <plugin name="customAttributeMerger" type="VendorNameSpace\Module\Plugin\AttributeMergerPlugin"/>

AttributeMergerPlugin.php VendorNameSpace\Module\Plugin

namespace VendorNameSpace\Module\Plugin;

class AttributeMergerPlugin
    public function afterMerge(\Magento\Checkout\Block\Checkout\AttributeMerger $subject, $result)
        /* that add new class inside the city div
        after edit look like :
        <div class="field **cusotom_city** _required" data-bind="visible:     visible, attr: {'name': element.dataScope}, css: additionalClasses" name="shippingAddress.city"> */

        if (array_key_exists('city', $result)) {
            $result['city']['additionalClasses'] = 'cusotom_city';

        return $result;

Hope this will help you. thanks

  • 1
    Helped me to modify existing field! Kudos!!
    – anonymous
    Commented Mar 9, 2021 at 14:11

Here is the path where you can edit city text field for New Shipping Address Form which was rendered form XML file:


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.