Anterior Siguiente
Generar documento

Parametrización

Documentación,Tupale,Visualización,Plantillas,Datos
La parametrización en Tupale, es la forma como llamamos a la personalización gráfica de los datos en las visualizaciones automáticas que entrega la herramienta.

Plantillas



Las plantillas son la agrupación de CSS y HTML que se emplea para la visualización de los datos recolectados, es el conjunto del código que da estilo a los datos, que se convierte en lo que el usuario puede ver. De esta visualización depende la usabilidad de los datos, que puedan ser útiles y de facil acceso.




Nombre de las plantillas



Los nombres de las plantillas tienen directa relación con su respectiva visualización, los nombres son predefinidos y deben ser empleados explicitamente dependiendo de su función. Usar otros nombres para la definición de las plantillas, no permite su correcta visualización.




Plantillas visuales



De la creación de estilos depende la visualización final en la página, de no ser definidas las plantillas en algunas aparece una visualización básica por defento en texto plano y tablas, y en otras como el grid, de no ser definida la plantilla no se visualiza ninguna información




Nombres predefinidos



landingpage –> Nombre de plantilla de visualización principal de cada formulario y la primera que debe ser creada para visualizar los datos en una primera instancia.



mapa –> nombre de plantilla que parametriza la visualización de los datos en el mapa a través de un modal, se debe seleccionar del total de la información, cual se requiere en el mapa y escoger la mejor forma de visualización para optimizar.



relacion –> nombre de plantilla que crea la visualización para los campos relación que se muestran en otros formularios.



respuesta —> nombre de plantilla que permite la visualización de los formularios anidados, dentro del formulario receptor.



grid –> nombre de plantila que debe ser creada para visualizar los resultados de la búsqueda cuando se emplea el campo buscador.



resaltado –> nombre de plantilla que se crea cuando se requiere que datos de un formulario sean visualizados de forma resaltada en todas las instancias de la navegación.



email –> nombre de plantilla que permite agregar estilo y parametrizar el envio de un email con información respectiva de uno o varios campos de un formulario.




Visuales avanzadas



timeline –> nombre de plantilla que permite parametrizar las visualizaciones de las líneas de tiempo.



presentacion —> nombre de plantilla para crear presentaciones utilizando una visualización como el siguiente ejemplo: https://tupale.co/presentacion.php?id=179#/ (Si se le da guardar a la pagina desde el navegador descarga un archivo html con la presentación.




Plantillas funcionales



Se requieren para visualizar los campos de manera organizada al desplegar ciertos datos, más que estilos de CSS o HTML emplean los contenidos de campo que veremos con detalle más adelante.



relacion_drop –> nombre de plantilla que permite la visualización cuando se usan campos relación como filtros, en el menú desplegable del buscador dentro de un formulario



Usar otros nombres diferentes a los anteriores para la definición de las plantillas, NO permite su visualización.




Crear Plantillas




Acceder al parametrizador



Para acceder al parametrizador debes ingresar cómo Desadministrador




  • Ruta
    Formularios > Administrar > Ir al formulario > Editar > Parametrización > Plantillas




    • NO hay plantilla, aparece un cuadro de diálogo indicando que no se ha creado aún ninguna platilla y el botón de crear plantilla

    • SI hay plantillas, debes escoger cual de las plantillas deseas editar






El parametrizador es un editor que emplea funciones de arrastrar y soltar para editar código html, css y permite la integración con bootstrap que entre otras cosas facilita la visualización multidispositivo y el diseño responsivo.



Las plantillas se crean utilizando html y css3, Milfs utiliza Bootstrap como base para el css y tambien se puede utilizar los temas gratuitos de https://bootswatch.com/ hacemos una plantilla para mostrar la información de diferentes formas, para ello es necesario llamar los campos que tenemos asociados a un formulario y estas son las formas de llamarlos:




Identificar los contenidos de campo



Junto con el Css, html y boostrap es determinante llamar los campos que tenemos asociados a un formulario para que su contenido sea visualizado. Para iniciar la creación de las plantillas debes identificar los campos a visualizar por medio de su número que aparece al lado derecho del parametrizador, es útil hacer un borrador para saber cuales campos vamos a usar y cómo se deben ver según su aplicación.




Contenidos de campo



A continuación, las diferentes formas de llamar los campos; identifica y emplea la que mejor se ajuste en cada caso



$nombre[id_campo] –> Permite leer el nombre del campo en las plantillas



$campo[] –> Muestra el campo con HTML si contiene.



campo_full[] entrega las respuestas en una línea de texto separadas por comas



$campo_limpio –> Muestra el campo sin HTML



$campo_limpio_80 –> Muestra solo 80 caracteres del contenido del campo sin HTML



$campo_40[] –> Muestra 40 caracteres



$campo_80[] –> Muestra 80 Caracteres



$campo_55[] –> Muestra 55 Caracteres



$fecha –> Muestra la fecha de publicación de los datos.



Los campos de selección multiple y checkbox permite recopilar información multiple dentro de un campo, diferentes opciones de respuesta que pueden ser seleccionados y despues desplegados en las plantillas para su visualización.



El contenido de campo para campos multiples se puede llamar en las plantillas de 3 maneras que entrega una visualización respestiva por defecto, esta puede ser modificado con estilos de css.




Recomendaciones



Para hacer las plantillas se pueden utilizar editores HTML y CSS3 compatibles con bootstrap, a continuación una lista de editores que se pueden usar para este proposito:






Tambien se puede utilizar y adaptar recursos conocidos como “Snippets” o pequeñas porcinos de codigo que se pueden reutilizar, para el caso de las plantillas puede encontrar codigos reusables en los siguientes enlaces:




Mensaje
Si
No
Reportar
Comentar
Mostrar
Editar