# Placeholders and Input Formats

Any input field can be set with a placeholder so the customer can be informed on what information needs to be typed into that field.

<figure><img src="https://3790748257-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT43PzcNjyZtWby9yrGd3%2Fuploads%2FlfZeuAseuF3walCcvrwM%2Fimage.png?alt=media&#x26;token=eeb450fe-6cb2-4fd3-b752-c00f46b3ec7e" alt="" width="563"><figcaption></figcaption></figure>

Some fields support an input mask, allowing you to customize how the field reacts to the entered values

* [Card Number](#placeholdersandinputformats-cardnumber)
* [Expiration Date](#placeholdersandinputformats-expirationdate)
* [Phone Number](#placeholdersandinputformats-phonenumber)

***

### Card Number <a href="#placeholdersandinputformats-cardnumber" id="placeholdersandinputformats-cardnumber"></a>

Card Number is by default a "text" input type with a maximum of 16 characters, no spaces. You may set the input type to "number" with a maximum of 16 characters, with no spaces in the placeholder. Neither option requires a placeholder. However the placeholder can format the numeric entry multiple ways.

| **placeholder**     |
| ------------------- |
| 0000000000000000    |
| 0000 0000 0000 0000 |
| 0000-0000-0000-0000 |

{% hint style="danger" %}
You cannot use “•••• •••• •••• ••••”.  Only alphanumeric values are allowed. Using text, like “Card Number”, will use default formatting of 0000 0000 0000 0000.
{% endhint %}

To accept 19-digit card numbers, add the class **ccExtended** to the Card Number input.  This will not override a 16-digit placeholder.  This option should be used with a text placeholder or a 19-digit placeholder.

&#x20;

<figure><img src="https://3790748257-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT43PzcNjyZtWby9yrGd3%2Fuploads%2FlFSwX4qEVsX9pKOXJu5m%2Fimage.png?alt=media&#x26;token=5a798336-442c-4be0-9dd7-6dc6f8ecef9f" alt=""><figcaption><p>Page builder</p></figcaption></figure>

<figure><img src="https://3790748257-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT43PzcNjyZtWby9yrGd3%2Fuploads%2FVg4AA6rwHmMUe9xoBAVX%2Fimage.png?alt=media&#x26;token=3e65f7af-b64c-4412-987c-20dd49b19265" alt="" width="548"><figcaption><p>Live page</p></figcaption></figure>

***

### Expiration Date <a href="#placeholdersandinputformats-expirationdate" id="placeholdersandinputformats-expirationdate"></a>

Expiration Date input by default is formatted as MMYY. If you prefer MM/YY, then enter MM/YY as the placeholder. On a live page the forward slash will automatically add as the consumer types.

| **placeholder** |
| --------------- |
| MM/YY           |
| MMYY            |
| 00/00           |
| 0000            |

<figure><img src="https://3790748257-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT43PzcNjyZtWby9yrGd3%2Fuploads%2FeNXw8DIqPDpm64DjDsUy%2Fimage.png?alt=media&#x26;token=72daba35-ef02-4e7d-9c35-914fc5a87230" alt="" width="563"><figcaption><p>Page builder</p></figcaption></figure>

<figure><img src="https://3790748257-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT43PzcNjyZtWby9yrGd3%2Fuploads%2FK2UnFIOy4Venem412emD%2Fimage.png?alt=media&#x26;token=053f62d3-2983-4247-9d69-e8cfd0438ffe" alt="" width="548"><figcaption><p>Live page</p></figcaption></figure>

***

### Phone Number <a href="#placeholdersandinputformats-phonenumber" id="placeholdersandinputformats-phonenumber"></a>

Phone Number is by default a "text" input type with no character limit. You may set the input type to "number", with no spaces in the placeholder or format. This does not require a placeholder for formatting. However you can use the format from builder settings to specify the format of the input in several different ways.

Phone may also be formatted using the phone country plugin enabled on the funnel Maintenance page.

| **placeholder** |
| --------------- |
| (000) 000-0000  |
| 000 000 0000    |
| 000-000-0000    |
| 000.000.0000    |
| 000-0000        |

<figure><img src="https://3790748257-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT43PzcNjyZtWby9yrGd3%2Fuploads%2Flwf18HreNdXH7A0WkhEQ%2Fimage.png?alt=media&#x26;token=df1e24f4-1add-4b83-82f7-662609674094" alt="" width="563"><figcaption><p>Page builder</p></figcaption></figure>
