CMS Plugins WordPress

[WordPress] Adjuntar varios archivos en Contact Form 7

[titulo]Subir múltiples archivos con barra de carga en CF7[/titulo]

Tal y como vimos en el artículo sobre cómo enviar archivos adjuntos en Contact Form 7, tenemos la opción de poner múltiples campos [codigo]archivo[/codigo]. Uno por cada archivo que queramos adjuntar. Pero esa opción, además de parecer estéticamente poco profesional, tiene algunos inconvenientes:

  • Cada campo archivo tiene su propia configuración individual. Por lo que si queremos que a través de nuestro formulario se envíen max. 5 archivos con un total de 16MB, habrá que ir haciendo la cuenta y limitando cada campo de manera independiente.
  • Cuando se adjuntan los archivos desde el equipo, éstos quedan indicados como en un formulario de HTML cualquiera, [subraya_verde]pero no se inicia la carga hasta que pulsamos el botón enviar. Como no aparece ningún gif indicando que se están subiendo los archivos, el usuario puede creer que el formulario no está haciendo nada y no funciona, y volver a pulsar una y otra vez el botón enviar interrumpiendo la carga de archivos.[/subraya_verde].

 

Para evitar todos estos inconvenientes, hay un excelente plugin desarrollado por Glen Don L. Mongaya:

Drag and Drop Multiple File Upload [Descargar]

Este plugin hace de CF7 lo que CF7 debería ser por defecto si cuidase un poquito más la estética y la usabilidad.

Tiene un Drag and Drop (pincha y arrastra) para subir los archivos, además del tradicional botón «Explorar».

Y como hemos comentado, cada archivo que se sube, muestra una barrita de carga indicándole al usuario si se ha subido ya, y si lo ha hecho correctamente:

Aportando de esa forma mucha más información al usuario, y no demorando el envío cuando se haga clic en el botón «Enviar».

En definitiva, mucha más información para el usuario que dará una estética más agradable, útil e intuitiva, y sobretodo evitará errores de impaciencia y desconocimiento.

 

¡A disfrutarlo!

Cristian Sarabia Martínez

Desde que a principios de los 90 mi padre desempolvó su Spectrum, no he dejado de probar y experimentar con la tecnología.

Enamorado del mundo web, Full Stack Developer de profesión y diseñador por devoción.

Ahora hago mis pinitos en esto del blogging para compartir con vosotros un poquito de todo lo que la comunidad me ha dado.

1 Comentario

Haz clic aquí para dejar tu comentario

  • Hola, noe he logrado usarlo, hago la configuracion bien pero me lanza error (Uno o más campos tienen un error. Por favor, revísalos e inténtalo de nuevo.) solo sucede cuando le agrego el drag and drop, del resto envía bien. Que puede ser, me podrias ayudar?