Gantry 5 Framework
Grupo de Usuarios de Joomla de Vigo�Junio 2016
Presentación
Marcos Oya
Pablo Arias
Contenidos
¿Qué es Gantry 5?
¿Cómo se instala Gantry 5?
Terminología propia de Gantry 5
¿Qué es Gantry 5?
Es un marco de trabajo para el frontend de un sitio web, que consta de dos partes:
Hidrogen es la plantilla gratuita que ofrece RocketTheme para usar Gantry 5
Licencia de uso
GNU/GPL
Se puede utilizar para cualquier proyecto, incluso con fines comerciales.
No es necesario mostrar ningún banner ni aviso en la parte pública.
No se puede eliminar al autor del código.
Se puede utilizar como base para la construcción de otras plantillas.
¿Cómo se instala Gantry 5?
Igual que cualquier otra plantilla, desde el Gestor de Extensiones.
Primero el framework y después la plantilla.
Demostración inicial del panel de control
Demostración de cómo funciona Gantry.
Lo tenemos instalado y funcionando para enseñarlo.
Terminología propia de Gantry 5
PRESET: son preconfiguración de estilos de plantilla, facilitada por Gantry o creada por el usuario y guardada para posteriores usos.
PARTÍCULAS: son una especie de módulos propios de Gantry 5.
ÁTOMOS: son bloques de código que podremos insertar (pj. código Google Analytics, archivos CSS, archivos javascript).
OUTLINES: son estilos de plantilla, a los que asignamos un nombre y guardamos para vincular a distintos elementos de menú.
POSITIONS: son partículas que nos permiten insertar módulos de joomla.
Estilos de plantilla
La vinculación de un outline o estilo con los elementos de menú en los que se va a usar se hace en ASSIGMENTS.
BASE OUTLINE: es la configuración de colores, tipografías, posiciones de módulos etc. por defecto.
HIDROGEN HOME: es la configuración para la página de inicio (make default inicio)
HIDROGEN PREDETERMINADO: es la configuración para el resto del sitio, si nosotros no decidimos crear más Outlines para cualquier elemento de menú que deseemos. ( all languages)
Crear nuevo estilo
Se puede copiar desde la base o desde otro estilo ya creado.
Cada estilo se asigna a unos determinados elementos de menú.
Los estilos permiten personalizar cada sección del sitio de forma diferente.
Layout
Permite generar la estructura de la página arrastrando y soltando.
Se pueden insertar, mover y eliminar partículas, posiciones, módulos y el componente principal.
Configuración independiente de cada bloque de manera visual.
Demostración del layout
Demostración de la parte del layout
Editor de menú
Permite insertar módulos y partículas dentro del menú y en cada desplegable.
Se pliega automáticamente en pantallas pequeñas.
Documentación:
Sobreescritura
Se pueden realizar overrides de cualquier componente o módulo
Se hace en carpeta html.
También se pueden hacer sobreescrituras de las partículas.
¡Ojo! El framework Gantry ya trae algunas sobreescrituras. Se pueden utilizar estas o las vistas de la extensión original.
Uso de la rejilla en los contenidos
Al crear contenidos se pueden utilizar las clases de Gantry para posicionar los contenidos.
Útil para que contenidos complejos se adapten a pantallas pequeñas, por ejemplo.
Documentación:
Hoja de estilos personalizada
Dentro de la carpeta de la plantilla custom:
Crear una carpeta SCSS y dentro el archivo custom.scss
Los CSS van a la carpeta CSS, dentro de custom también.
Documentación:
http://docs.gantry.org/gantry5/tutorials/adding-a-custom-style-sheet
Otras personalizaciones
Se pueden crear nuevas partículas.
Se pueden crear plantillas propias con Gantry 5, y venderlas incluso.
Fin
¡Gracias!