Entradas

Bootstrap

Bootstrap surge con la pretensión de superar este obstáculo otorgando a los desarrolladores una base sobre la que trabajar y definir un marcado estándar para ciertos elementos de una página web, a la par que proporcionar un diseño responsive (tan de moda últimamente, como comentábamos en un artículo anterior), capaz de acoplar éste a cualquier resolución de pantalla y dispositivo móvil.

Sí que es cierto que el estilo de todos estos elementos, tan limpio y entendible para el usuario, es más idóneo para interfaces de administración que para el front-end de una página web, pero siempre es posible añadir reglas propias de estilo en un fichero aparte para adaptarlo a aquél que nos venga impuesto desde arriba por un PSD o por el propio equipo de diseño.

Para mejorar esta experiencia en el front-end, también surgen proyectos como el de Bootswatch, que dispone de varias plantillas para extender el estilo base de Bootstrap.

bootswatch-bootstrap

Bootstrap básicamente se compone de un conjunto de ficheros CSS de mínimo peso (6Kb comprimidos) que podemos añadir a la cabecera de nuestra página web para comenzar a utilizar. Una vez añadidos, la idea es definir el grid (para marcar el diseño responsive) y el marcado de los elementos que deseemos utilizar. Tenemos gran cantidad de documentación al respecto en la página oficial de Bootstrap.

Una muestra de la extensión de este framework es que la siguiente versión de Joomla, la 3.0., disponible a priori en septiembre de este mismo año, implantará internamente Bootstrap. Esto significa que algunos de los módulos del núcleo de Joomla cambiarán su marcado para acoplarse al marcado definido por Bootstrap. A nivel de plantillas, esto no debería suponer un gran cambio para aquellas que provengan de la versión 2.5. de Joomla. En el siguiente enlace está disponible una demo de esta nueva versión de Joomla que está por llegar para que vayamos abriendo boca.

En el intento de integrar Bootstrap con Joomla, uno de los proyectos más interesantes disponibles en la red es Joostrap. Joostrap dispone de un catálogo de plantillas base listas para integrar en una página web que utilice Joomla. Desde Domatix hemos estado testeando una de estas plantillas para comprobar cuán efectiva es su integración en dicho gestor de contenidos (algunos de nuestros próximos retos son comprobar la integración de la responsividad en WordPress y Prestashop). Algunas de las conclusiones a las que hemos podido llegar son:

•  Al ser Bootstrap un software en fase de desarrollo, su implantación todavía está algo verde y, en ocasiones, aparte de la documentación oficial, la integración en un CMS carece de una documentación sólida con la que poder comenzar a trabajar.

•  Deben modificarse a mano algunas de las plantillas de los principales módulos de Joomla, como por ejemplo las plantillas del famoso módulo K2, para acoplarlas al marcado de Bootstrap.

•  Bootstrap utiliza como base las librerías Jquery y nuestra experiencia es que, al usar Joomla como base la librería Mootools, se han tenido que aplicar algunos arreglos todavía no muy bien documentados para que ambas fueran compatibles. La nueva versión de Joomla incluirá Jquery y permitirá la convivencia de ambas librerías, por lo que esperamos que esta compatibilidad sea mayor y con ello la documentación disponible al respecto.

bootswatch-bootstrap

Responsive web design (RWD)

El objetivo de las páginas web “responsive” es facilitar la navegación, usabilidad y lectura, ajustando los contenidos sin reducir el tamaño, es decir, reubicando los elementos de la propia web según el tamaño del área de visionado del cliente web.

Las principales características de un diseño web “responsive” son:

  • Visualización optimizada en todos los dispositivos, smartphones y tablets
  • Experiencia de usuario óptima
  • Optimización de la velocidad de carga para dispositivos más pequeños
  • Optimización de motor de búsqueda para dispositivos más pequeños
  • Gestión del mismo código, archivos y administración para todos los dispositivos

Responsive Design Web

Si desea que una web muestre el mismo contenido en dispositivos más pequeños, el diseño “responsive” es el camino a elegir. Las plantillas “móviles” para web están extremadamente limitadas o son versiones recortadas del sitio web completo, ocultando muchas partes del mismo y sesgando la experiencia de navegación del usuario.

Además, utilizando diseños “responsive”, la gestión del código base y aspecto será la misma para todas las visualizaciones. No hay que olvidar que actualmente hay 5 mil millones de dispositivos móviles, y cada vez es más usual navegar en este tipo de pantallas.

Algunos recursos interesantes para comenzar con RWD:

Para testear el aspecto de una web en diferentes tamaños: MattKersleyresizeMyBrowser, ScreenFly, Responsivepx.

Algunas herramientas adicionales:

Actualización: Una preview de lo que será la versión 3.0 de Joomla, de la mano de Joomshine: http://joomla30.joomlashine.com/

Finalmente también vale la pena darse una vuelta por el proyecto Bootstrap, desarrollado por los ingenieros de Twitter y actualmente disponible en GitHub. Y algunos recursos para Bootstrap.

Solve Chronoforms getInputByName2 error

  • Update chronoforms to v.4 and create from scratch all your forms
  • Edit the chronoforms component to solve the problem

 

As the v4.0 version can be installed side by side with the old v.3.2 version you can combine both solutions. So you can solve manually the compatibility error and then do the form migration slowly.

Edit the Chronoforms component to solve the problem.

Edit the file:

components/com_chronocontact/libraries/includes/JSvalidation.php

and search:

Element.extend({
        getInputByName2 : function(nome) {
            el = this.getFormElements().filterByAttribute('name','=',nome)
            return (el)?(el.length)?el:el:false;
        }
    });

Replace it with:

Element.implement({
        getInputByName2 : function(nome) {
            el = this.getFormElements().filterByAttribute('name','=',nome)
            return (el)?(el.length)?el:el:false;
        }
    });

This changes the method definition to make it compatible with Mootools 1.2.5+

Hide K2 category in breacrumbs

WARNING: As this isn’t parametrized you will remove the category link for all the items views.

The modification is simple. Just edit the file:

components/com_k2/views/item/view.html.php

and around line 240 replace:

//Set pathway
        $menus = &JSite::getMenu();
        $menu = $menus->getActive();
        $pathway = &$mainframe->getPathWay();
        if($menu) {
            if($menu->query['view']!='item' || $menu->query['id']!= $item->id){
                if(!isset($menu->query['task']) || $menu->query['task']!='category' || $menu->query['id']!= $item->catid)
                $pathway->addItem($item->category->name, $item->category->link);
                $pathway->addItem($item->title, '');
            }
        }

with:

//Set pathway
        $menus = &JSite::getMenu();
        $menu = $menus->getActive();
        $pathway = &$mainframe->getPathWay();
        if($menu) {
            if($menu->query['view']!='item' || $menu->query['id']!= $item->id){
                if(!isset($menu->query['task']) || $menu->query['task']!='category' || $menu->query['id']!= $item->catid)
                // Domatix: do not add item category to breadcrumbs 
                //$pathway->addItem($item->category->name, $item->category->link);
                $pathway->addItem($item->title, '');
            }
        }

As we are modifying the K2 core files you will lose changes when you update your K2.

Domatix 2.1

Confiamos con este movimiento poder atraer nuevos clientes y fortalecernos para competir con empresas más fuertes, tradicionalmente del sector de “software propietario”, y atraerlas hacia el software libre.

Iremos detallando las novedades durante las próximas semanas en los canales habituales…

¡Nuevamente gracias a clientes, compañeros y amigos por estar ahí!

¿Buscas trabajo como programador de OpenERP/Software Libre?

Debido al aumento de la demanda en el sector acorde a las nuevas necesidades de mercado, estamos buscando programadores para incorporar a nuestra plantilla que reunan las siguientes características:

Programador web: conocimientos html5, css, mysql, php. Se valorarán conocimientos sobre Joomla y Magento. El enfoque del trabajo será básicamente crear y mantener portales corporativos y tiendas virtuales. Necesario conocimiento de administración de servidores GNU/Linux e imprescindible utilizar linux a nivel de usuario. Se valorarán conocimientos de Django y Python.

Programador junior: para incorporar a equipo de trabajo OpenERP. Necesario conocimiento en el desarrollo de aplicaciones orientadas a objetos, especialmente Python. Se valorarán conocimientos de OpenObject, experiencia con otros ERPs, participación en comunidades de software libre (traducción, localización…) Herramientas colaborativas libres y de nuevo, utilizar linux como sistema operativo a nivel de usuario.

Se ofrece incorporación inmediata en Domatix. El trabajo se realizará en nuestras oficinas, en horario comercial, con una dinámica flexible y variable.
La retribución económica será acorde con los conocimientos y experiencia del candidato.

Retomando el blog

En breve estaremos haciendo ruido de nuevo.

Domatix 2.0

Todos los cambios estructurales del pasado año, incluyeron una mejora de las instalaciones, así como un cambio de las líneas telefónicas (gracias a Jazztel, por dar de baja el número sin haberlo solicitado), en un momento en el que el trabajo no dejaba de llamar a nuestra puerta. A costa de nuestra propia presencia online, dividimos el tiempo disponible entre nuestros clientes, y esta mejora de nuestras propias instalaciones. Intentando, sin éxito, tratar de juntar algo de tiempo para poder dedicar a nuestro propio proyecto.

Aún así, han sido muchos los nuevos clientes que han confiado en nuestros servicios, con apenas un cartel de “estamos en ello” en nuestra web, y sabemos que esa confianza depositada ha sido devuelta con creces, sacando adelante proyectos y desarrollos, algunos de los cuales se prometían duros de roer.

En todo caso, ya estamos de vuelta, aún puliendo muchos detalles y con cosillas por mejorar en la web, pero considerando que nuestra presencia online ya comienza a responder al rumbo de la empresa, y procuraremos seguir actualizando y mejorando, de una manera más constante que hasta ahora.

Todavía quedan muchos proyectos internos por definir o mejorar (virtualmente hablando) como sunegocioonline.com, idomatix.com, openerpspain.com, y alguna sorpresa más que vendrá, pero confiamos en que nuestra nueva política de tiempos nos permita dedicarle tiempo a todos estos portales, así como a las comunidades de los desarrollos en los que estamos involucrados.

Mientras, seguiremos trabajando intensamente con proyectos centrados en nuestro software libre favorito, como Joomla, Magento, OpenERP y GNU/Linux.

Desde aquí, sólo agradecer el constante apoyo y confianza de nuestros clientes fieles, obviamente responsables finales de que sigamos al pie del cañón.

Gracias por seguirnos y seguir contando con nosotros. Bienvenidos a Domatix 2.0

Crear y mantener una página web

Poco más de un lustro más tarde los blogs empezaban a despuntar. Su éxito era en parte debido a la facilidad con la que un usuario podía publicar una entrada en su blog. ¿Qué había cambiado? Simple, los blogs contaban con un sistema gestor de contenidos, un CMS (Content Management System), muy sencillo pero, sobre todo, fácil de usar.

Hoy coexisten las dos maneras de hacer webs, cada una con sus ventajas e inconvenientes. Si pensamos introducir cambios en el sitio web de manera poco frecuente y la estructura no es compleja, muy probablemente un sitio estático sea la mejor solución. Un sistema gestor de contenidos nos permitirá realizar cambios frecuentes y mantener una estructura de información más sofisticada, entre otras ventajas. A cambio, un CMS necesita una infraestructura que hay que instalar y mantener. Como veremos más adelante, tenemos un abanico de opciones para esa infraestructura, que van de las sencillas de mantener pero limitadas en opciones y capacidad de personalizar a las más potentes pero, a su vez, más exigentes en recursos y conocimientos.

Creando una web sencilla

Así, cuando la página no pretende más que ofrecer una información puntual que no debe cambiar, puede ser interesante usar opciones sencillas y a priori menos costosas que los sistemas de gestión de contenidos.

Las páginas web estáticas (a priori aquellas que no usan un CMS) suelen necesitar menos recursos del servidor que las dinámicas. En primer lugar la página se crea una vez y a partir de ahí el servidor se limita a servirla a todos los usuarios que la pidan. No necesita ni traducciones, ni consultas a una base de datos ni nada similar. A cambio la modificación del contenido siempre será algo más costosa, normalmente requerirá ser trabajada en un ordenador local para después subirla al servidor mediante FTP. Es una buena opción en los casos en que la página web cambia poco, porqué el coste más elevado en las modificaciones se compensa con menos necesidades y por tanto menos coste en el servidor.

Una primera opción, seguramente la más flexible y potente, puede ser crear una página web con algún programa que permita la edición de (X)HTML como puede ser Adobe Dreamweaver, Microsoft Expression Web o KompoZer. Esta opción es sencilla aunque requiere conocimientos avanzados de (X)HTML y de un programa cliente de FTP.

Otra posibilidad es utilizar un servicio web que nos permita crear y almacenar una página web con un sencillo editor. Es el caso de Geocities, Google Page Creator, Páginas Web Gratis o EveryOneWeb. La ventaja es que no son necesarios conocimientos de (X)HTML ni un cliente FTP porqué las páginas se hacen sobre el servidor, pero a cambio estos servicios suelen crear páginas con estructuras muy rígidas y muy parecidas unas a otras.

Sistemas gestores de contenidos

Un CMS es un software que facilita la gestión de los contenidos de una página web. Su utilidad es manifiesta cuando la página se modifica frecuentemente, como un blog, una revista o la web de una empresa que actualiza a menudo la información corporativa.

En un CMS los contenidos se guardan separadamente de la presentación, generalmente en una base de datos (BD). De esta manera, cada vez que se solicita una página, el servidor debe obtener los datos de la BD y juntarlos con la información de la presentación para servir al cliente la página final. Este proceso suele requerir un servidor más potente que en el caso de páginas web estáticas, pero a cambio, la introducción de nuevos datos o la modificación de los existentes, sólo requiere el uso de un formulario que se encargará de guardar los datos en la base de datos.

Actualmente la variedad de sistemas gestores de contenidos es muy elevada: En CMSMatrix, tienen una comparativa de más de 900; y no están todos. Así, buscar el más adecuado para un determinado proyecto es una tarea muy complicada y generalmente los usuarios tienen tendencia a usar aquel que conocen, aunque no se adapte a lo que realmente quieren hacer.

Generalmente los CMS ofrecen posibilidades de personalización muy altas. Todos ofrecen diferentes plantillas para personalizar la presentación, y los genéricos, además, ofrecen numerosas opciones para añadir funcionalidades al sistema. Incluso en aquellos CMS donde no se ofrecen excesivas funcionalidades, no es extraño que ofrezcan un conjunto de funciones pensadas para que el usuario pueda modificar completamente el aspecto o pueda añadir funcionalidades creando plugins.

Para seleccionar adecuadamente un CMS existen algunas clasificaciones que pueden sernos de utilidad. Por una parte, la clasificación tradicional es la que se refiere a la utilidad que se dará al sistema. Sin ser una clasificación perfecta (una de las características de los CMS es su flexibilidad que les permite hacer más cosas que aquellas para las que fue creado) si puede ser un buen punto de partida.

Clasificación de CMS según el tipo de gestión y/o contenidos

Esta es la clasificación más comúnmente usada. Sin embargo es una clasificación extraña porqué mezcla la manera como se gestiona el contenido y el tipo de contenidos que se gestionan. Sin embargo el resultado es una clasificación muy completa.

En esta clasificación encontramos los siguientes tipos de gestores de contenidos:

Genéricos. Están pensados para ofrecer servicios de diferentes tipos y pueden usarse tanto para gestionar un blog personal, como un portal, una revista, una tienda,… En esta categoría se incluirían Plone, OpenCMS, MySpace, TYPO3, Mambo, Joomla o Drupal.

Blogs. Son los CMS especialmente creados para la gestión de diarios personales. Son CMS de blogs WordPress, B2Evolution, Movable Type, Blogger.

Wikis. Los wikis son un tipo de CMS pensados para que varios usuarios creen un documento o un conjunto de documentos de manera comunitaria. Mantiene un registro de modificaciones, lo cual permite ver en cada momento que cambios ha hecho cada usuario. MediaWiki es seguramente el CMS de este tipo más conocido, por ser el que se usa en la Wikipedia, aunque también son dignos de mención TikiWiki, PikiWiki o PmWiki.

Foros. Estos CMS permiten la gestión de foros de discusión. Son conocidos phpBB, PunBB, MyBB o SMF.

Galerías de imágenes. Permiten subir y gestionar imágenes, crear álbumes, enviar fotos a imprimir, ejemplos clásicos son Gallery, Flickr, PicasaWeb o Coppermine.

Comercio electrónico. Son CMS especializados en la gestión de sitios que se dedican a la compra-venta de productos a través de la web. Algunos ejemplos son osCommerce, Magento o PrestaShop.

De todas formas, esta clasificación aun siendo tal vez la más clara, no es del todo exacta. El motivo es que los gestores de contenido son muy flexibles y muchas veces pueden ser usados para webs que no guardan relación con el uso original que pretendió su creador.

Servicios de CMS

Aunque muchos de los CMS que acabamos de ver requieren ser instalados en un servidor web propio, existen también empresas que se dedican a ofrecer como servicio un CMS compartido. En estos casos, a pesar de que el CMS está compartido por cientos o miles de usuarios, en la práctica cada uno de ellos trabaja con el sistema como si fuese un usuario único.

Es el caso de WordPress o Blogger, como gestores de blogs, MySpace como CMS genérico, Pikiwiki como wiki o PicasaWeb o Flickr como galerías de imágenes. La gran ventaja de estos CMS es que para usarlos sólo hay que darse de alta en el servicio. A cambio las posibilidades de adaptación son menores.

Los CMS instalables son más adaptables, pero a cambio requieren un espacio web propio del usuario, así como mantenimiento y actualización constantes.

Clasificación según las características necesarias del servidor

No todos los CMS utilizan los mismos lenguajes de servidor ni funcionan sobre los mismos tipos de servidores. Por eso es importante saber que requerimientos tiene el CMS que queramos usar. La siguiente tabla muestra los algunos gestores de contenidos y sus requerimientos técnicos:

De nuevo, comentar que CMSMatrix puede ser un buen punto de partida para ver las características del CMS que queremos instalar y sus requerimientos técnicos. Sin embargo siempre es bueno consultar las webs de los programas para asegurarse de que los datos son correctos y tener en cuenta que no todos los CMS aparecen en CMSMatrix.

Personalizando un CMS

Una de las características más interesantes de los CMS son las posibilidades de personalización. Unos párrafos antes escribía que los sistemas gestores de contenidos acostumbran a disponer de varias plantillas para adaptar la presentación a las necesidades del usuario. También suelen permitir la inclusión de pequeños programas (llamados plugins) que añaden funcionalidades, generalmente desarrollados por usuarios con necesidades concretas que se solucionan ellos mismos y que después ceden a la comunidad o, en algunos casos, comercializan.

La comunidad de desarrolladores y usuarios formada alrededor de cada CMS es, además, otro factor clave a la hora de elegir una u otra herramienta. En primer lugar, porque es importante que haya un núcleo fuerte de desarrolladores que mantenga el código y añada funcionalidades, tanto dentro de la propia herramienta como en forma de plugins. Además, la comunidad de diseñadores es esencial para que no todas las instalaciones de un CMS tengan exactamente el mismo aspecto.

Para poder permitir el desarrollo de plugins y facilitar la creación de nuevas plantillas que permitan personalizar la presentación de las páginas creadas con un determinado CMS, los creadores de este tipo de software suelen proporcionar abundante documentación sobre las funciones que permiten el acceso a los datos.

Un caso particular es el de las plantillas. La creación de plantillas para CMS es una tarea compleja que requiere leerse bien los manuales que los equipos de desarrollo suelen publicar. Dependiendo del proyecto, la documentación puede ser más o menos completa y el desarrollo de plantillas más o menos compleja. Un ejemplo de documentaciones bien hechas son las de WordPress y la de Drupal.

Enlaces artículo:

Introducción a los Sistemas de Gestión de Contenidos (CMS) de código abierto (Xavier Cuerda Garcia y Julià Minguillón Alfonso)

http://mosaic.uoc.edu/articulos/cms1204.html

Via: mosaic.