Embed Size (px)
DESCRIPTION
El presente trabajo tiene por objetivo mostrar un marco de trabajo para el Desarrollo Web utilizando Joomla! y Gantry Framework, los cuáles permite desarrollar portales web de gran factibilidad operativa en muy poco tiempo, minimizando los problemas de compatibilidad entre navegadores, Layout sin tablas y HTML no semánticos, entre otros problemas clásicos de cualquier proyecto web, permitiendo dar mucho más valor a los productos que se desarrollen sobre estos.
Citation preview
Desarrollo Ágil de sitios Web utilizando Joomla y Gantry
Framework
Miguel Cantillana Farí[email protected]@opensur.orghttp://www.miguelcantillana.com
ELINUX 2011
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
¿Qué debemos saber?
2
● Joomla!● CSS● HTML
ELINUX 2011 – PUERTO MONTT
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
… 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
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
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
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
¿Cómo funciona?
8ELINUX 2011 – PUERTO MONTT
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
¿Cómo funciona?
10
¿Cómo funciona?
11ELINUX 2011 – PUERTO MONTT
¿Cómo funciona?
12ELINUX 2011 – PUERTO MONTT
¿Cómo funciona?
13ELINUX 2011 – PUERTO MONTT
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
DEMO
15ELINUX 2011 – PUERTO MONTT
Recursos
● http://960.gs● Http://www.gantry-framework.com● http://docs.joomla.org
