Set Maximum Field Length

Hi 317th,

We don’t currently have any built in ability to limit the number of characters for a field, though this is on our feature request list (and I’ll add your vote to that, as well).

This can be done, though, with a little custom code:

/**
 * Limit number of characters allowed for a field
 * Apply the class "wpf-char-limit" to the field to enable.
 *
 */
function wpf_char_limit() {
	?>
	<script type="text/javascript">
		jQuery(function($){
			$('.wpf-char-limit').attr('maxlength',9); // Change number to character limit
		});
	</script>
	<?php
}
add_action( 'wpforms_wp_footer', 'wpf_char_limit' );

In case it helps, we have a tutorial with how to add custom code like this here.

Once you’ve added the code to your site, you’ll need to do a couple things:

1) Adjust the number for the max character length (if you look in the code, it’s currently set to 9).

2) Then, you’ll need to open the form builder and click on the field you want to apply this to. From that Field Options panel, you’ll need to open Advanced Options then add “wpf-char-limit” to the CSS Classes field. Here’s a screenshot so you can see exactly how that should look.

With this approach, you can apply this same character limit to any WPForms field on your site.

I hope that helps! Please let me know if you have any questions ??

Unfortunately, this solution didn’t work for me. Will this solution prevent additional text from being entered at the specified limit, or is it supposed to block the submission?

Please add another vote for this feature; it was essential when using Contact Form 7, and I’m really missing it since migrating to WPForms!

• This reply was modified 7 years, 2 months ago by polychromatic.
• This reply was modified 7 years, 2 months ago by polychromatic.

Hi polychromatic,

Certainly, I’ve added your vote to this feature request ??

In case it helps, we’ve recently published a tutorial for this in our developer docs: https://developers.wpforms.com/docs/limit-number-of-characters-for-a-text-field/. The code is the same, but the details of its use are hopefully clearer there.

This code is meant to limit the number of characters that can be entered into a field (so if the user tries to type more than that limit, it just won’t work — no additional characters can be entered).

I hope that helps!

Curious; I wonder why it doesn’t do that for me. I can keep typing away without any issue. Maybe I’ll try another route other than Code Snippets.

Thanks!

Hi polychromatic,

Sorry about that! Possibly there’s a conflict with some other JavaScript on your site.

If you’re interested in pursuing this further, this guide from WPBeginner walks through how to track down code conflicts with other plugins or a site’s theme.

And if you do decide to pursue this and find a conflict source, please let us know — that way hopefully it may help others who find this thread and experience a similar issue.

Thanks! ??