Formularios en Joomla 1.6 con ChronoForms

chronoforms_0Tutorial para crear formularios en Joomla 1.6 utilizando Chrono Forms.Este componente nos permitirá crear formularios personalizados de forma rápida, empleando el sistema “drag and drop”.

 

Podremos validar los datos mediante Java Script, cuenta con soporte para Captcha, nos permitirá enviar la información de los fomularios mediante email y almacenarla en la base de datos, etc.

Podemos descargar el componente desde su página oficial. Una vez instalado, accederemos a él desde “Componentes > ChronoForms”.

Para crear un nuevo formulario, iremos a la pestaña “Easy Form Wizard”. En la parte de la izquierda, veremos una lista de elementos que podremos añadir al formulario arrastrándolos a la zona de la derecha (pestaña preview).

chronoforms_1

 

Podremos editar las propiedades de los elementos pulsando sobre el icono de propiedades.

chronoforms_2

 

En la pestaña “Emails” configuraremos las propiedades de envío de correo.

chronoforms_3

 

  • Desde la sección “General”, activaremos el envío de email, elegiremos el formato del texto, etc.

chronoforms_4

 

  • En “Template”, escribiremos un texto para el email.

chronoforms_5

 

  • Si vamos a la sección “Static”, podremos completar los campos del email, como el “Para”, el asunto, dirección de respuesta, etc.

chronoforms_6

 

  • En “Dynamic”, podremos vincular los campos del formulario con los campos del email. Para ello, bastará con escribir el nombre del campo del formulario en su lugar correspondiente.

chronoforms_7

 

En la sección “Thanks Message”, escribiremos el mensaje que se mostrará tras enviar los datos del formulario.

chronoforms_8

 

Desde la pestaña “Files Uploads”, configuraremos los parámetros para la subida de archivos, como las extensiones, el path, los tamaños máximos y mínimos, etc.

 chronoforms_9

 

La sección “Code”, nos permitirá agregar código Java Scipt, Css y código personalizado.

chronoforms_10

 

En “Anti Spam”, configuraremos el Captcha. Para que funcione correctamente, tendremos que añadir un elemento del tipo “Captcha Input” a nuestro formulario.

 chronoforms_11

 

Desde “Store Data”, estableceremos los parámetros para el almacenamiento del contenido de los formularios en la base de datos.

 chronoforms_12

 

La tabla en la que se almacenarán los datos, la crearemos desde “Froms Manager > Create Table” una vez creado y guardado el formulario.

 chronoforms_13

 

Los campos de la tabla se generarán de forma automática, no obstante, podremos modificarlos a nuestro gusto.

chronoforms_13_1

 

En “Form Settings”, introduciremos el nombre del formulario y podremos publicarlo.chronoforms_14

 

Otro método para crear formularios es hacerlo desde la sección “Form Wizard”. Al igual que en el caso anterior, añadiremos los elementos al formulario arrastrando y soltando, desde la zona de la izquierda a la de la derecha.

 chronoforms_15

 

En la pestaña “Events” podremos definir las acciones que se ejecutarán cuando se lancen los eventos del formulario. Para ello, elegiremos las acciones de la pestaña “Actions” y las arrastraremos al evento de la pestaña “Events”.

chronoforms_16

 

Disponemos de un gran número de acciones que nos permitirán integrar el formulario con el sistema de usuarios de Joomla, utilizar sistemas de pago como Paypal, interactuar con la base de datos, etc.

Para acceder a la configuración de las acciones, pulsaremos en el botón de propiedades de la acción.chronoforms_17

 

Además, podremos añadir eventos al formulario con el botón “Add Event”.

 chronoforms_18

 

En la pestaña “Form Settings”, tendremos que escribir el nombre del formulario y lo publicaremos.chronoforms_19

 

En “Legend” veremos una lista de iconos con una breve explicación sobre su uso.

chronoforms_20

 

Si nos dirigimos a la sección “Forms Manager”, veremos una lista con los formularios que hemos creado.

chronoforms_21

 

Pulsando en el nombre del formulario podremos modificar sus propiedades.

  • En “General”, tendremos la opción de cambiar el nombre, publicarlo, cambiar su modo de edición (“Form Wizard” o “Easy Form Wizard”), etc.

chronoforms_22

 

  • Si vamos a “Code”, podremos modificar el código HTML del formulario y escoger el tipo de formulario (Custom o Wizard). Si elegimos la opción “Wizard”, no podremos utilizar el asistente para modificar el diseño del formulario.

chronoforms_23

 

  • Desde la pestaña “JS Validation”, activaremos y configuraremos las opciones de validación mediante Java Script.

chronoforms_23_1

 

Pulsando en el botón “Backup Forms” podremos hacer una copia de seguridad de los formularios. Se generará un archivo que tendremos que guardar en nuestro disco duro. Esta copia incluirá toda la configuración del formulario, pero no incluirá los datos almacenados en la base de datos.

chronoforms_24

 

Para restaurar un formulario, pulsaremos en “Restore Copy”, buscaremos el archivo con extensión “.cf4bak” correspondiente y, tras pulsar en “Submit”, el formulario estará disponible.

chronoforms_25

 

Con el botón “Show Data” veremos el contenido de la tabla vinculada al formulario. Para ello seleccionamos el formulario y la tabla y pulsamos sobre el mencionado botón.

chronoforms_26

 

Accederemos a una lista con los registros de la tabla y podremos acceder a su contenido pulsando en el registro que deseemos.

chronoforms_27

 

Para que nuestro formulario sea accesible desde el front-end tendremos que crear el enlace correspondiente desde el gestor de menús. Añadiremos un ítem del tipo “Chronoforms Display Form”.

chronoforms_28

 

Escribimos el nombre del formulario que queremos enlazar y ya será accesible desde nuestra web.

chronoforms_29

 

El resultado será similar al siguiente:

chronoforms_30

 

 

Enlace | Chrono Engine

Comentarios  

#3 RAFAEL UREÑA LORCA 11-02-2015 14:49
No puedo acceder a los archivos de imagenes que cargo en el formulario
Citar
#2 Roberto García 25-11-2014 04:01
Como puedo hacer que mi formulario aparezca dentro de un artículo Joomla 3.x

No he podido hacerlo.
Citar
#1 israel hernandez 23-10-2014 03:30
Hola:

Como puedo realizar un formulario en donde pueda capturar varias tablas, es decir tengo 6 tablas en las cuales debo de capturar la información de un registro solo que no se como relacionar en el formulario esas 6 tablas, le agradecería mucho la orientación.

Saludos
Citar

Escribir un comentario

Por favor procura que tus comentarios estén relacionados con la entrada, comenta con tu nombre y no pongas enlaces en tu comentario. Intenta también respetar a los demás lectores, los comentarios off topic, promocionales, ofensivos o ilegales serán editados y borrados.


Código de seguridad
Refescar