- Description
-
Details
Overview
This module integrates the International Telephone Input JavaScript plugin with Magento 2.
It shows country flags for telephone inputs and provides other useful features such as validation, country detection, etc. The easiest way to add phone validation in MagentoPlease note, that this module works with the full international phone number format only (national mode option is not applicable).
Features
- Adds country flag dropdown to telephone input fields
- Full validation, including specific error types
- Automatically select the user's current country using an IP lookup
- Automatically set the input placeholder to an example number for the selected country
- Navigate the country dropdown by typing a country's name, or using up/down keys
- Retina flag icons
- It's possible to apply the widget to custom inputs
Applicable areas
This extension covers all standard Magento areas containing telephone inputs.
Community Edition:
- Customer Account: Address Book
- Contact form
- Checkout: billing and shipping address forms
- Shipping to Multiple Addresses
Enterprise Edition:
- Gift Registry form
- B2B (Enterprise Edition version):
- Company Registration form
- Company Profile
- Company Structure
- Company Users
- Negotiable quote - add new address form (My Quotes section)
- Customer and Customer Address attributes
- Customer Registration form
- Customer Account Edit form
- Customer Address Registration
- Customer Account Address
Installation
1. Copy contents of the src directory to the root directory of your Magento installation.
2. Run these commands to enable the module:
php bin/magento module:enable Magery_IntlTelInput php bin/magento setup:upgrade
Enterprise Edition module installation
There is an additional module available for Enterprise/Cloud editions: Magery_IntlTelInputEe
It can be installed using this commands:php bin/magento module:enable Magery_IntlTelInputEe php bin/magento setup:upgrade
Configuration
Module configuration can be found in admin:
Stores → Configuration → Customers → International Telephone InputConfiguration options:
General Enabled Enables module Allow Dropdown Display the country dial code next to the selected flag so it's not part of the typed number. Custom CSS Container Additional classes to add to the parent div. Separate Dial Code Display the country dial code next to the selected flag so it's not part of the typed number. Use Utils Script Enables formatting and shows telephone number placeholder (example format for the selected country). Enable Validation Enables validation provided by Google's libphonenumber library. Country Settings Allowed Countries List of the countries included in the dropdown. Initial Country Mode Allows selecting the initial country.
Available options:
- None - the first available country will be selected
- Auto - detects the customer's country using IP geolocation lookup
- Configured - allows specifying one country that will be selected by defaultInitial Country Configured Default selected country (if "Initial Country Mode" option is set to "Configured") Preferred Countries Specify the countries to appear at the top of the list. Advanced Custom Input IDs This option gives the ability to initialize the plugin for custom fields. Comma-separated list of custom text input IDs. Applies to the following pages:
- Customer Registration
- Customer Account Edit
- Customer Address Registration
- Customer Account Address
JavaScript plugin information
- This module uses the International Telephone Input plugin.
- Plugin demo: https://intl-tel-input.com/
- Reviews
-
Customer Reviews 1 item(s)
- Great one
-
It has great coverage! We use this module for our B2B website, and it works perfectly!
Rating
- Change Log
-
Version: 1.2.0
- Magento 2.4.5 Compatibility
- intl-tel-input JS plugin updated to v17.0.18
Version: 1.1.1- Magento 2.4.2 Compatibility
- intl-tel-input JS plugin updated to v17.0.12
Version: 1.0.5Initial stable release (EE module version: 1.0.0)