Desarrollo de ágil de sitios web utilizando Joomla gantry Framework
-
Upload
miguel-cantillana-farias -
Category
Documents
-
view
3.638 -
download
2
description
Transcript of Desarrollo de ágil de sitios web utilizando Joomla gantry Framework
![Page 1: Desarrollo de ágil de sitios web utilizando Joomla gantry Framework](https://reader034.fdocuments.net/reader034/viewer/2022052321/547d21c0b479598e508b487b/html5/thumbnails/1.jpg)
Desarrollo Ágil de sitios Web utilizando Joomla y Gantry
Framework
Miguel Cantillana Farí[email protected]@opensur.orghttp://www.miguelcantillana.com
ELINUX 2011
![Page 2: Desarrollo de ágil de sitios web utilizando Joomla gantry Framework](https://reader034.fdocuments.net/reader034/viewer/2022052321/547d21c0b479598e508b487b/html5/thumbnails/2.jpg)
1
Índice
● Qué es Joomla● Características● Ejemplos
● Qué es Gantry-Framework● Características ● Cómo funciona
● Ejemplos de Implementación
ELINUX 2011 – PUERTO MONTT
![Page 3: Desarrollo de ágil de sitios web utilizando Joomla gantry Framework](https://reader034.fdocuments.net/reader034/viewer/2022052321/547d21c0b479598e508b487b/html5/thumbnails/3.jpg)
¿Qué debemos saber?
2
● Joomla!● CSS● HTML
ELINUX 2011 – PUERTO MONTT
![Page 4: Desarrollo de ágil de sitios web utilizando Joomla gantry Framework](https://reader034.fdocuments.net/reader034/viewer/2022052321/547d21c0b479598e508b487b/html5/thumbnails/4.jpg)
Qué es Joomla
3
● Joomla es un gestor de contenido (CMS), de código abierto escrito en PHP y utiliza como motor de datos mySQL.
● Con Joomla podemos crear portales web, flexibles y altamente escalables
● Joomla es Software Libre!
ELINUX 2011 – PUERTO MONTT
![Page 5: Desarrollo de ágil de sitios web utilizando Joomla gantry Framework](https://reader034.fdocuments.net/reader034/viewer/2022052321/547d21c0b479598e508b487b/html5/thumbnails/5.jpg)
… y que son las plantillas?
4
● Son las encargadas de definir el aspecto estético, disposición de elementos y estilo visual de nuestro sitio web.
ELINUX 2011 – PUERTO MONTT
![Page 6: Desarrollo de ágil de sitios web utilizando Joomla gantry Framework](https://reader034.fdocuments.net/reader034/viewer/2022052321/547d21c0b479598e508b487b/html5/thumbnails/6.jpg)
Módulos y Plantillas
5
● Los módulos son pequeñas aplicaciones que permiten mostrar información específica.
● Joomla distribuye sus funcionalidades a través de módulos.
● Cada módulo puede estar presente en distintos apartados del sitio.
ELINUX 2011 – PUERTO MONTT
![Page 7: Desarrollo de ágil de sitios web utilizando Joomla gantry Framework](https://reader034.fdocuments.net/reader034/viewer/2022052321/547d21c0b479598e508b487b/html5/thumbnails/7.jpg)
Gantry Framework
6
● Framework para el desarrollo de Plantilla para Joomla!
● Desarrollado por Rocket Theme● Se integra como un Plugins● Basado en 960 Framework CSS
ELINUX 2011 – PUERTO MONTT
![Page 8: Desarrollo de ágil de sitios web utilizando Joomla gantry Framework](https://reader034.fdocuments.net/reader034/viewer/2022052321/547d21c0b479598e508b487b/html5/thumbnails/8.jpg)
Qué nos ofrece Gantry?
7
● 65 Posiciones de módulos para situar funcionalidades de Joomla.
● Completo Soporte para Joomla!
● 38 posibles combinaciones de layout para cuerpo y columnas (Mainbody y Sidebar)
● Dispone de configuración de vistas Mobile/iPhone y Android
● Sencilla Interfaz de administración
● Soporte para RTL language
● Permite compresión de CSS y JS
● Layout sin tablas
● Compatibilidad entre navegadores (IE6, IE7, IE8, Firefox, Chrome, Safari)
ELINUX 2011 – PUERTO MONTT
![Page 9: Desarrollo de ágil de sitios web utilizando Joomla gantry Framework](https://reader034.fdocuments.net/reader034/viewer/2022052321/547d21c0b479598e508b487b/html5/thumbnails/9.jpg)
¿Cómo funciona?
8ELINUX 2011 – PUERTO MONTT
![Page 10: Desarrollo de ágil de sitios web utilizando Joomla gantry Framework](https://reader034.fdocuments.net/reader034/viewer/2022052321/547d21c0b479598e508b487b/html5/thumbnails/10.jpg)
Framework CSS 960
9
● El principio básico de este framework es crear maquetaciones de ancho fijo de 960px
● Características● Ofrece un marco de trabajo sencillo● Permitir crear layouts fácilmente, utilizando 12 ó 16
columnas● Posee una hoja de estilo de reset● Compatibilidad con los navegadores mas populares
ELINUX 2011 – PUERTO MONTT
![Page 11: Desarrollo de ágil de sitios web utilizando Joomla gantry Framework](https://reader034.fdocuments.net/reader034/viewer/2022052321/547d21c0b479598e508b487b/html5/thumbnails/11.jpg)
¿Cómo funciona?
10
![Page 12: Desarrollo de ágil de sitios web utilizando Joomla gantry Framework](https://reader034.fdocuments.net/reader034/viewer/2022052321/547d21c0b479598e508b487b/html5/thumbnails/12.jpg)
¿Cómo funciona?
11ELINUX 2011 – PUERTO MONTT
![Page 13: Desarrollo de ágil de sitios web utilizando Joomla gantry Framework](https://reader034.fdocuments.net/reader034/viewer/2022052321/547d21c0b479598e508b487b/html5/thumbnails/13.jpg)
¿Cómo funciona?
12ELINUX 2011 – PUERTO MONTT
![Page 14: Desarrollo de ágil de sitios web utilizando Joomla gantry Framework](https://reader034.fdocuments.net/reader034/viewer/2022052321/547d21c0b479598e508b487b/html5/thumbnails/14.jpg)
¿Cómo funciona?
13ELINUX 2011 – PUERTO MONTT
![Page 15: Desarrollo de ágil de sitios web utilizando Joomla gantry Framework](https://reader034.fdocuments.net/reader034/viewer/2022052321/547d21c0b479598e508b487b/html5/thumbnails/15.jpg)
CSS por Bloque
● El CSS que dibuja gantry por bloque es el que sigue:<div id=”rt-NOMBRE”> <div class=”rt-container”></div></div>
● Para Módulos:<div id=”rt-block”> <div class=”module-title”>
<h2>TITULO MODULO</h2></div>
</div>
14ELINUX 2011 – PUERTO MONTT
![Page 16: Desarrollo de ágil de sitios web utilizando Joomla gantry Framework](https://reader034.fdocuments.net/reader034/viewer/2022052321/547d21c0b479598e508b487b/html5/thumbnails/16.jpg)
DEMO
15ELINUX 2011 – PUERTO MONTT
![Page 17: Desarrollo de ágil de sitios web utilizando Joomla gantry Framework](https://reader034.fdocuments.net/reader034/viewer/2022052321/547d21c0b479598e508b487b/html5/thumbnails/17.jpg)
Recursos
● http://960.gs● Http://www.gantry-framework.com● http://docs.joomla.org