Gantry 5 framework usuarios de joomla 2017

Gantry 5 Framework Grupo de Usuarios de Joomla de Vigo Junio 2016

Presentaciรณn Marcos Oya

Pablo Arias www.pabloarias.eu

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: ● ●

Framework Plantilla

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.

OUTLINES: son estilos de plantilla, a los que asignamos un nombre y guardamos para vincular a distintos elementos de menú.

PARTÍCULAS: son una especie de módulos propios de Gantry 5.

POSITIONS: son partículas que nos permiten insertar módulos de joomla.

ÁTOMOS: son bloques de código que podremos insertar (pj. código Google Analytics, archivos CSS, archivos javascript).

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: http://docs.gantry.org/gantry5/configure/menu-editor

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: http://docs.gantry.org/gantry5/advanced/responsive-content

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!