This page is also available in English.
La versión 4.1 de Contact Form 7 ha introducido opciones de longitud mínima y máxima para algunas etiquetas de formulario, y un nuevo tipo de etiqueta de formulario para un recuento de caracteres, similar a como lo hace Twitter.
Opciones de longitud mínima y longitud máxima
Las opciones maxlength
y minlength
están basadas en los atributos HTML5 del mismo nombre que especifican la longitud mínima y máxima permitida para los campos de entrada.
Los tipos de etiquetas de formulario que son compatibles tanto con maxlength
como con minlength
son: text
, textarea
, email
, url
, tel
, quiz
y captchar
(respuesta CAPTCHA). Estas etiquetas de formulario (excepto quiz
y captchar
) también son compatibles con la validación de entrada del usuario basada en la longitud de los caracteres.
Ejemplo:
[textarea* tu-mensaje minlength:10 maxlength:140]
Con la etiqueta de formulario textarea
del ejemplo anterior, verás un mensaje de error de validación si tu entrada tiene menos de 10 caracteres o más de 140 caracteres. Sin embargo, la mayoría de los navegadores te impedirán escribir más allá del límite de longitud máxima.
El formato anterior para establecer una longitud máxima (ejemplo: [textarea* tu-mensaje 40/140]
) todavía está disponible, pero si la opción explícita maxlength
está establecida, lo sobrescribirá.
Recuento de caracteres
Es posible que quieras un recuento de caracteres para un campo de entrada con la opción maxlength
, que indique cuántos caracteres has escrito, o puedes escribir en el campo, hasta alcanzar el límite de longitud máxima.
Para añadir un recuento de caracteres, inserta una etiqueta de formulario count
en tu formulario. La etiqueta count
solo funciona como un marcador de posición para un recuento de caracteres (entero). Ten en cuenta que la etiqueta debe tener el mismo nombre del campo de entrada al que quieres asignarla.
Por ejemplo, si tienes este campo (nombre = «tu-mensaje»):
[textarea* tu-mensaje minlength:10 maxlength:140]
y quieres activar el recuento de caracteres en este campo, añade [count tu-mensaje]
:
[textarea* tu-mensaje minlength:10 maxlength:140] [count tu-mensaje]
Por defecto, la etiqueta count
muestra el número de caracteres en el campo asignado, por lo que su valor entero aumenta a medida que escribes.
También puedes invertir el conteo para que muestre el número de caracteres restantes hasta la longitud máxima del campo asignado. Para ello, añade la opción down
en la etiqueta de formulario count
:
[textarea* tu-mensaje minlength:10 maxlength:140] [count tu-mensaje down]
En este caso, la etiqueta count
muestra «140» al comienzo, disminuyendo a medida que escribes: cuando hayas escrito 140 caracteres, mostrará «0».
Demostración:
Mira el código fuente del formulario anterior:
[textarea* tu-mensaje minlength:10 maxlength:140]
[count tu-mensaje]
[textarea* tu-mensaje-2 minlength:10 maxlength:140]
[count tu-mensaje-2 down]