jueves, 22 de octubre de 2009

3 opciones de configuración básica, casi obligatorias

EDITOR EXTENDIDO

Ya hemos visto en la entrada de edición de contenidos en Joomla! cómo extender el editor TinyMCE para darnos total flexibilidad el editar textos, imágenes, ficheros, formatos, etc. Es recomendable acitvar el editor extendido desde la propia instalación del gestor.

URL's SEMÁNTICAS O AMIGABLES

Otra opción que debería de activarse por defecto con la instalación, son las URL amigables o semánticas. Utilizar direcciones web entendibles por el usuario es un factor importantísimo para los motores de búsqueda. Joomla! no los utiliza por defecto. Ello se consigue desde 'Sitio' -> 'Configuración global' y a la derecha habilitar URLs amigables para motores de búsqueda. Una vez hecho esto comprobar la diferencia en la dirección web de cada página cuando no está activado.

La demostración de la importancia de este factor se puede ver buscando 'segunda familia' en Google. El primer resultado es nuestro sitio de referencia. Si buscamos 'asociacion segunda familia', aparece en tercer lugar, siendo el primero una web con una URL que incluye estos términos: http://www.qype.es/place/preview/es-1105890-asociacion-segunda-familia-huarte

COMPATIBILIZAR VERSIONES

Cuando vayamos instalando nuevas extensiones y plugins a nuestro sitio Joomla! nos ahoraremos más de unos cuantos probloemas y mensajes de error si activamos la opción de compatibilidad entre versiones. En 'Extensiones' -> 'Gestor de plugins' buscamos en la segunda página del listado 'Sistema - Legado' y lo publicamos pulsando en el icono correspondiente.


En definitiva estos tres pasos deberían de activarse al instalar el Joomla! pero al no ser el caso se han de realizar manualmente debido a la importancia que tienen.

Menús con enlaces a Categorías y Secciones

Hasta ahora hemos hecho ítems de menú enlazados a artículos concretos. Si por ejemplo (continuando con nuestro sitio de referencia) pulsamos Noticias en la web www.segundafamilia.com vemos un listado con un resumen previo de varios artículos.

Esta funcionalidad es muy práctica para desarrollar un Blog, o una sección de Noticias, de Novedades, o incluso de Proyectos realizados por una empresa.

La forma de llevar a cabo esta navegación es en el momento en el que creamos un nuevo ítem de menú, cuando nos solicita Seleccionar el tipo de ítem del menú. En la opción Artículos surgen las siguientes posibilidades además de la que hemos utilizado Presentación del artículo:

  • Presentación de la categoría blog
  • Presentación de la lista de categorías
  • Presentación de la sección blog
  • Presentación de la sección

Probando a enlazar ítems de menú con estas opciones se puede comprobar el comportamiento exacto de Joomla! en tales casos. En la columna derecha al editar el ítem tenemos varias opciones interesantes en Parámetros - BásicoParámetros - Avanzados.

miércoles, 21 de octubre de 2009

Manual de Joomla!

Este documento en formato PDF es el manual que con más frecuencia aparece recomendado en internet: Manual de Usuario de Joomla 1.0 (PDF - 6.2 MB)

Está referido a la versión 1.0 cuando nosotros estamos trabajando con la 1.5, sin embargo es muy recomendable como lectura introductoria a Joomla!

Edición de los contenidos

El editor web que aparece por defecto para la edición de los contenidos de un artículo es el TinyMCE. Joomla! instala otras opciones pero este editor se está convirtiendo en un estándar en estas funciones.

TinyMCE extendido: en primera instancia se instala una versión básica de edición que es más que recomendable extender desde: 'Extensiones' -> 'Gestor de plugins' -> 'Editor - TinyMCE', y en la columna derecha 'Funcionalidad' -> 'Extendido', y 'Guardar' o 'Aplicar'

TinyMCE permite modificar el formato del texto con negrita, cursiva, subrayado, tachado, diferentes alienados, niveles de encabezamiento, índices, subíndices, tipos de fuente, color, color del fondo, etc. Controla formatos de listados numerados o no, y tablas de datos.

También dispone de opciones interesantes para copiar, pegar, deshacer cambios, buscar texto; así como la inserción de imágenes, ficheros multimedia, símbolos, líneas horizontales, etc.

En definitiva se trata de un potente editor de contenidos que proporciona una gran flexibilidad para todo tipo de formatos de textos, y que la mejor manera de controlarlo es ir probando cada una de sus opciones.

EL GESTOR MULTIMEDIA

Dese 'Sitio' -> 'Gestor Multimedia' accedemos a la interfaz de un explorador de archivos con el que gestionamos la subida de todo tipo de ficheros al directorio /images/ del sitio raíz de nuestra web.

Un documento que se suba aquí, se puede enlazar desde el editor TinyMCE como 'images/nombredocumento' (incluyendo la extensión del documento).

viernes, 16 de octubre de 2009

Los menús en Joomla!

Tras la creación del contenido (artículos) organizado en secciones y categorías dentro del back-end o administración, hemos visto en clase cómo se crean y gestionan los menús de navegación de la página web. La idea básica para iniciarnos, es que un menú tiene un nombre o título, y uno o varios enlaces y subenlaces. En Joomla! estos enlaces se denominan ítems del menú. Todo ello se lleva a cabo desde el Gestor de menús en la admimistración.

Otra idea o concepto importante, y no muy claro si no se detalla, es que cada menú hay que asociarlo a un bloque para posicionar y visualizar el menú en la página. Estos bloques posicionales se denominan en Joomla! como módulos, y se gestionan desde otra sección del administrador. Al dar de alta un menú se solicita el nombre que se le quiere dar a este bloque o módulo que va a soportarlo en la estructura de la página. SI ESTE CAMPO SE DEJA VACÍO, ¡NO SERÁ POSIBLE VISUALIZAR EL MENÚ!

Tras la correcta creación del menú y sus ítems, la visualización y colocación del menú se realiza desde el Gestor de módulos donde se localiza el nuevo módulo, se edita, se habilita y se selecciona su localización en los principales bloques de la página web.

El siguiente vídeo se aproxima cosiderablemente a los pasos que hemos seguido hasta ahora en clase para gestionar los menús:

Y este documento detalla también la gestión de los menús de Joomla!

Organización de los contenidos: Secciones, Categorías y Atículos

La organización de la información que se utiliza en Joomla! se estructura en tres niveles jerárquicos:
  1. Secciones
  2. Categorías
  3. Artículos

La unidad básica de información es un artículo, que es básicamente una página de contenido que puede incluir texto, imágenes, enlaces, información multimedia, etc. Cada artículo se agrupa en categorías, y estas a su vez en secciones. Podríamos hacer la equivalencia de las secciones y las categorías con carpetas y subcarpetas en un sistema operativo, respectivamente.

Las últimas versions de Joomla! permiten crear artículos sin clasificarlos por categorías. La experiencia muestra que es un opción muy utilizada en la práctica.

El siguiente vídeo detalla todos los pasos en la creación y edición de secciones, categorías y artículos en Joomla! 1.5:

Una idea importante en los pasos inciales de introducción de Joomla!, es que esta es una organización interna de la información y en principio no está relacionada con los menús de navegación que se crean a posteriori. Esta idea resulta en ocasiones algo confusa, pero una vez asimilada, uno se da cuenta de la flexibilidad que proporciona.

jueves, 15 de octubre de 2009

Las plantillas de diseño

En las siguientes URLs encontraréis plantillas de diseño de Joomla! gratuitas:
  1. http://www.joomlademo.de/
  2. http://www.joomlaos.de/
  3. http://www.joomlashack.com/
  4. http://www.joomla24.com/
  5. http://www.joomlart.com/

Para la instalación seguimos los siguientes pasos:

  1. Nos descargamos el fichero de la plantilla. Generalmente es un .zip
  2. En el back-end de Joomla! vamos a 'Extensiones' -> 'Instalar/Desinstalar'
  3. En 'Subir paquete' seleccionamos el fichero y pulsamos 'Subir Archivo & Instalar'
  4. Saldrá un mensaje de instalación exitosa
  5. Vamos a 'Extensiones' -> 'Gestión de plantillas'
  6. Seleccionamos la que queremos activar y pulsamos 'Predeterminado'
  7. Refrescando nuestro sitio (pulsando F5) veremos el cambio visual

Copiar el portal completo en una memoria USB

Los ordenadores del aula donde se imparte la asignatura, se suelen formatear bastante a menudo. Como todo el trabajo que desarrollamos en nuestra página web se almacena en la base de datos, lo perderíamos como causa de este formateao. Tampoco es posible llevarnos las tablas de la base de datos con la información.
El proceso de realización de las copias de seguridad en la memoria USB será el siguiente:
  1. Doble clic en el icono naranja del pie de la ventana para abrir XAMPP Control
  2. STOP - STOP - EXIT
  3. Entramos al direcotrio D:\xampplite donde está nuestro servidor web, la base de datos y nuestro(s) portal(es) Joomla.
  4. Seleccionamos todos los ficheros. Tened cuidado de borrar o de no seleccionar el fichero comprimido del día pasado.
  5. Los comprimimos en un sólo fichero. Por defecto lo llamará xampplite.zip (creo)
  6. Guardamos en la memoria USB este fichero

Cuando volvamos al día siguiente y si han formateado los ordenadores, podremos recuperar todo sin necesidad de instalarlo desde el principio. Para ello:

  1. Creamos la carpeta D:\xampplite
  2. Descomprimimos en esta carpeta el fichero que creamos el día anterior
  3. Desde D:\xampplite\ ejecutamos setup_xampp.bat
  4. Si en la pantalla que surge nos pregunta (en inglés) si queremos actualizar la configuración, pulsamos '1' e 'Intro'
  5. Desde D:\xampplite\ ejecutamos xampp-control.exe. Pulsamos 'Start' en Apache y en MySQL
  6. Accedemos a nuestra página http://localhost/joomla1 o http://localhost/joomla2/

martes, 13 de octubre de 2009

Instalación de Joomla!

La última clase vimos la plataforma sobre la que se ejecuta el gestor web Joomla1. Se vio la necesidad de utlizar un servidor web y una base de datos. Se mencionó el paquete XAMPP que instala estos bloques de manera local.

A continuación se detallan los pasos a seguir para una correcta instalación de Joomla! Se aconseja utilizar los mismos nombres y directorios que se indican para evitar confusiones posteriores.

  1. Partimos de que el alumno dispone los ficheros de instalación:
    - xampplite-win32-1.7.1.zip: para el servidor web Apache y la base de datos MySQL
    - Joomla_1.5.14-Spanish-pack_completo.zip: para instalar Joomla!
  2. En caso de no disponer de los mismos, pedirlo a algún compañero o solicitar al profesor que los copie en la carpeta compartida
  3. Extraer los ficheros de xampplite-win32-1.7.1.zip a D:\
  4. Observar que se crea el directorio D:\xampplite\
  5. Desde D:\xampplite\ ejecutar setup_xampp.bat. Con esto se configura el servidor web. Seguir las instrucciones hasta que indique 'Pulsar una tecla para continuar'
  6. Desde D:\xampplite\ ejecutar xampp-control.exe. Pulsar 'Start' en Apache y en MySQL
  7. En este punto se ha instalado un servidor web y base de datos en el ordenador. Se puede comprobar escribiendo la URL http://localhost/ en un navegador
  8. El directorio raíz del servidor web es D:\xampplite\htdocs\. Instalaremos Joomla! en un subdirectorio del mismo
  9. Crear el subdirectorio D:\xampplite\htdocs\joomla1\
  10. Extraer los ficheros de Joomla_1.5.14-Spanish-pack_completo.zip a D:\xampplite\htdocs\joomla1\
  11. Acceder a la URL http://localhost/joomla1/ desde un navegador web
  12. Selecciona Spanish y pulsar Siguiente
  13. En la segunda pantalla, pulsar Siguiente
  14. En la Licencia, Siguiente
  15. En la configuración de la base de datos:
    - Nombre del servidor: localhost
    - Nombre de usuario: root
    - Contraseña: (delar vacío)
    - Nombre de la base de datos: joomla1
    - Pulsar Siguiente
  16. En Configuración FTP: pulsar siguiente
  17. En Configuración Principal:
    - Nombre del sitio: (Opcional, aunque obligatorio) Mi sitio web Joomla1!
    - Correo electrónico: ponéis vuestro correo
    - Contraseñadel admin: admin (para poner todos el mismo, por ahora)
    - Pulsar Instalar datos de ejemplo predeterminados
    - Siguiente
  18. Borrar (o renombrar) el directorio: D:\xampplite\htdocs\joomla1\installation
  19. Ver el portal instalado en http://localhost/joomla1/
  20. El acceso a la administración del portal se realiza desde http://localhost/joomla1/administrator/
    - Usuario 'admin
    - Contraseña 'admin'

Como ejercicio instalar una segunda versión en un directorio joomla2 (http://localhost/joomla2/) sin los datos de ejemplo predeterminados. Para ello repetís los pasos a partir del punto 9 sustituyendo 'joomla1' por 'joomla2', y sin instalar datos de ejemplo del punto 17.

En internet hay una cantidad enorme de información y tutoriales sobre posibilidades de instalación de Joomla! en un ordenador de manera local. A modo de ejemplo este vídeo en Youtube donde realizan una instalación similar a la que hemos llevado a cabo en clase.

miércoles, 7 de octubre de 2009

Noticia interesante en la portada de la web de la UPNA

Recientemente ha aparecido una noticia en la portada de la web de la UPNA relacionada con el tema de la asignatura. Informan sobre el desarrollo de un portal web de una ONG como proyecto final de carrera de un alumno. La dirección del sitio es http://www.segundafamilia.com/.

Un primer vistazo al código fuente de la página muestra una línea de metadatos que dice:

meta name="generator" content="Joomla! 1.5 - Open Source Content Management"

cuyo significado obvio es que la plataforma utilizada para el desarrollo de la página es el gestor de contenidos de código abierto Joomla!, en su última versión 1.5.

Unas líneas más abajo, en los enlaces a las hojas de estilos de la página, se distingue:

link rel="stylesheet" href="http://www.segundafamilia.com/templates/ja_purity/css/template.css" type="text/css"

de donde se confirma la utilización de una plantilla de diseño llamada ja_purity.

La navegación a través del contenido y funcionalidades del sitio muestra la utilización de al menos los siguientes módulos de Joomla!:
  • Noticias
  • Enlaces de interés
  • Libro de visitas
  • Encuestas
  • Zona privada
  • Gestión de banners
  • Formulario personalizado
  • Agenda de eventos y actividades
  • Álbum de fotos
  • Galería de vídeos
  • Foro de debate

Teniendo en cuenta que este proyecto se ha llevado a cabo en la UPNA utilizando el CMS en el que se basa la asignatura, podemos tomar este sitio web como referencia para la asingatura (al menos inicialmente).

martes, 6 de octubre de 2009

Presentación de la asignatura

Al tratarse del primer curso que se imparte la asignatura no he tenido opción de reservar un aula con las plazas suficientes para todos los días. El aula 016 es la que menos problemas presentaba. Los siguientes días no será posible impartir la asignatura:

6 de octubre, martes
24 de noviembre, martes
15 de diciembre, martes

Existe reserva por parte de otro profesor en algunos otros días pero es probable que podamos intercambiar con el aula 017.



Este primer día hemos realizado la presentación de la asignatura. Se ha comentado la naturaleza totalmente práctica de la misma. El profesor introducirá los módulos al inicio de la clase, y se dejará el resto para practicar con los mismos. Se menciona las posibilidades que ofrece una comunidad de software libre para aquellos que quieran investigar sus propias soluciones.

La evaluación final se llevará a cabo en los últimos días de clase donde se expondrá un portal realizado en base a los módulos practicados, o los que el alumno aplique libremente.

Como introducción a la gestión de contenidos web nos hemos registrado en un blog y lo hemos configurado. Se han publicado entradas y moderado comentarios. La herramienta utilizada ha sido Blogger de Google. Se menciona también Wordpress por la opción de instalación local que permite.

Finalmente, recordar la necesidad de utilizar memorias extraíbles debido a la periodicidad del formateo de los ordenadores.