Customizing Form of guest for shipping address

[andybagadi2b88]

I can't find the file or the html for guest shipping address. I want to change the telephone input type from input type = text to input type = number. Any suggestion where to find it or how to customize this bug? (To produce this bug, checkout an item without logging in) Thank you!

[johnwebdes40a5]

Hello @andybagadi2b88 

Please follow the steps below to change the telephone input type from input type="text" to input type="number" in the shipping address form in Magento 2:

• Override the shipping address template:
  • In your custom theme, create a new file at the following location: app/design/frontend/[Vendor]/[Theme]/Magento_Checkout/web/template/shipping-address/form.html. This will override the default shipping address form template.
• Update the telephone input type:
  • Please open the form.html file and locate the input field for the telephone number. Change the type attribute from text to number using the following HTML:
    

    <input type="number" class="input-text" name="telephone" data-bind="value: telephone" autocomplete="tel">

• Please clear the cache:
  • After saving your changes, clear the cache to see the updated shipping address form.

Note: changing the input type to a number will display a numeric keypad on mobile devices, but it may also prevent users from entering certain characters, such as parentheses and dashes, that are commonly used in phone numbers. You may need to add additional validation or formatting logic to ensure that phone numbers are entered correctly.

If you find our reply helpful, please give us kudos.

A Leading Magento Development Agency That Delivers Powerful Results, Innovation, and Secure Digital Transformation.

WebDesk Solution Support Team

Get a Free Quote | | Adobe Commerce Partner | Hire Us | Call Us 877.536.3789