Input fields automatically switch the mobile keyboards to alphabetical vs numeric


#1

Hello - I read on one of the Unbounce blogs regarding mobile sites that it is recommended to have the input type specific to each field. How can we make these changes for a unbounce form? Thanks!

Telephone input type=“tel” /
Numeric input type=“number” /
Text input type=“text” /
URL input type=“url” /
Email input type=“email” /


#2

Hi @GHSD! You can change the input type of a field using some javascript. The below code will change the default phone number field to a “tel” field (remember to wrap the code in script tags):

  document.getElementById('phone_number').type = 'tel';
  document.getElementById('phone_number').style.marginTop = "20px";

The second line readjusts the spacing, as the default CSS from the builder it targeting input.text.

Hope this helps!