Curso online de Joomla: el primer vistazo a Joomla

19 04 2008

Recuerda que, como ya te indicamos en nuestro anterior artículo de esta serie dedicada a Joomla, para realizar el curso que ahora comenzamos sólo necesitarás disponer de una versión de Joomla ya empaquetada, con su propio servidor ya instalado y configurado, su propia base de datos ya creada y Joomla 1.0.13 ya instalado, para que tu única preocupación y ocupación sea experimentar con Joomla sin que te frenen las tareas de instalación.

Debes descargar, por tanto, el archivo comprimido zip que te indicamos en dicho artículo: el pack JoomlaSpanish-UniformServer-RC2. Una vez descargado descomprímelo y estará listo para su utilización. Renombra la carpeta (botón derecho del ratón - cambiar nombre) y llámala joomla pruebas para que la identifiques correctamente. Haz doble clic sobre ella y arranca el servidor mediante un doble clic en el archivo Iniciar-servidor.exe, espera a que la ventana del Dos se cierre y a que tu navegador predefinido te muestre la página inicial de acceso a la administración y al sitio Web de Joomla (podrás llegar a esta página inicial siempre que quieras tecleando en el campo de texto de la dirección URL del navegador el término localhost, te recomendamos que cierres IE, utilices el navegador Firefox y teclees en el campo dirección localhost para acceder a esta página inicial):

Página inicial pack joomla spanish uniform server


El Frontend y el Backend

En el contexto de los sistemas de gestión de contenidos como Joomla se suele hablar de Frontend y Backend. La instalación crea dos espacios accesibles vía Web:

  • El Frontend es la vista que se muestra a los visitantes de la Web. Es decir, el tradicional sitio web y la página inicial que visualizas cuando tecleas la dirección URL del sitio en el navegador. Si observas su aspecto verás que se trata de un completo y complejo portal con aspecto profesional: múltiples menús, un área de inicio de sesión, una encuesta, artículos con textos ficticios, etc. La estética, el diseño de la página, depende de una plantilla prediseñada, ya instalada con la instalación por defecto de Joomla, que podrás modificar y editar a tu gusto. En el ejemplo siguiente la plantilla escogida es rhuk_solarflare_ii. Pero podrás cambiarla por otra o instalar una nueva plantilla, ya te indicaremos cómo hacerlo.

Frontend o aspecto de tu sitio Web

  • El Backend es una página oculta al visitante, el área de administración. Aquí sólo puede entrar el administrador, previo inicio de sesión en el sistema.

administración

Un truco o, en realidad, una recomendación
Cuando realices tareas de administración y mantenimiento de la Web, te recomendamos encarecidamente que dejes abiertos el frontend y el backend al mismo tiempo (en diferentes pestañas de tu navegador, por ejemplo, o en diferentes ventanas). Así, podrás apreciar todos los cambios que realices en el backend de forma inmediata en tu sitio Web.

¿Cómo hacerlo?. En la pantalla inicial de Uniform Server 3.5 haz clic sobre el enlace

Administración de Joomla! Spanish 1.0.13

Accederás así al área de administración o backend. Observa que aparece una nueva página en una nueva pestaña de Firefox llamada Joomla! Spanish - Administración. Desde aquí podrás acceder al Backend de tu sitio Web. Presidiendo toda la página se encuentra un formulario de acceso al Sistema que deberás cumplimentar correctamente con ciertas credenciales para acceder a Joomla. En este caso en concreto teclea admin como nombre de usuario y admin como contraseña. Finalmente haz clic sobre el botón Entrar para acceder al Backend de tu sitio Joomla.

acceso administración

Para acceder al Frontend o al aspecto concreto de tu sitio Web tal y como lo vería cualquier visitante del sitio en este momento debes hacer clic sobre la entrada Sitio frontal Joomla! Spanish 1.0.13, desde la página inicial de Uniform Server. Fíjate que tienes abiertas dos pestañas diferentes en el navegador: en una de ellas podrás observar el diseño de tu sitio web, en la otra la página relativa a su administración.


Abrir el Frontend desde el panel de Administración

Con el procedimiento anterior tienes acceso al Frontend o al aspecto concreto de tu sitio Web (lo que verán los visitantes), pero la mayor parte de las veces abrirás el Frontend desde la propia administración de Joomla. A continuación verás más detalladamente el Panel de Control de la página inicial de Administración de Joomla. Por ahora sólo nos interesa que veas el menú de la parte superior, menú que te permitirá acceder a múltiples opciones:

Localiza en él la entrada Sitio y en el menú desplegable que emerge selecciona Vista Previa - En una Nueva Ventana.

vista previa del sitio

Esto hará que visualices el aspecto de tu sitio Web en una nueva pestaña de Firefox. A partir de ahora podrás cambiar entre ambas pestañas pulsando sobre el título de la misma: esto es muy útil y práctico, cuando realizas cambios en la página de Administración, pues simultáneamente verás las modificaciones en tu sitio con sólo recargar la página (pulsa F5, por ejemplo, para hacerlo, o utiliza el botón Recargar que te ofrece el navegador). Acostúmbrate, por tanto, a tener dos pestañas abiertas a la vez: en una el backend o administración, en la otra el frontend o tu sitio Web tal y como lo ven los visitantes de tu página.


El panel de control en la Administración de Joomla

Ya te hemos indicado anteriormente que en cuanto inicias sesión en el área de administración se muestra una página inicial principal desde la que accederás a todas las funcionalidades de Joomla. Puedes ver en ella tres secciones diferenciadas:

  1. Un menú desplegable en la parte superior.
  2. Un conjunto de grandes botones en la parte izquierda, que constituye el Panel de Control.
  3. Un cuadro resumen con navegación por pestañas, a la derecha de la pantalla.

Te explicamos sus utilidades y funcionalidades:

El menú desplegable

Ya hemos comenzado a echar un primer vistazo al menú desplegable de la parte superior al utilizar la entrada Sitio. Fíjate que incluye variadas opciones que utilizarás para la administración del sitio web, como la vista previa de la web, las plantillas o temas utilizadas para su diseño, los instaladores de nuevos temas, módulos, la administración de usuarios, la configuración del sitio web, etc. Sólo tienes que pasar el ratón por encima de cada entrada para acceder a los submenús correspondientes (ya has visto el funcionamiento, por ejemplo, de Sitio - Vista Previa).

menú superior

El Panel de Control

Ocupa la mayor parte de la pantalla y se caracteriza por la presencia de unos grandes botones de acceso directo a las tareas más comunes que realizarás en Joomla. Si jugueteas con los botones y acabas medio perdido en Joomla, sólo tendrás que hacer clic en la entrada del menú Inicio para volver a la página inicial del Panel de Control (puedes también hacer clic en el primer vínculo de la barra de navegación que se encuentra inmediatamente debajo: en este caso en el enlace Joomla! Spanish). ¡No tiene pérdida!

panel de control

El cuadro resumen

A la derecha de la pantalla localizarás un cuadro de resumen, que se muestra en pestañas:

panel de control

  • Registro. En esta pestaña se muestran los usuarios que actualmente han iniciado sesión en el sistema. Puedes “echar” a un usuario haciendo clic en la flecha roja situado a su derecha.
  • Componentes. Muestra la lista de componentes instalados en el sistema. Puedes navegar hacia cada uno de ellos, haciendo clic en su nombre.
  • Popular. Se muestran los artículos más populares, es decir, los que tienen más éxito entre los visitantes. Se muestra la fecha de creación y la cantidad de hits obtenidos. Muy práctico: si haces clic sobre su enlace podrás editar los artículos cliqueados.
  • Últimos artículos. Aquí se muestran las últimas entradas. También resulta muy práctico, ya que a menudo puede interesarte completar algo.

Una primera característica: las plantillas

Vas a realizar una primera aproximación a la utilización de plantillas en Joomla. En la pestaña de Administración haz clic sobre Sitio - Administrador de plantillas - plantillas del sitio.

menu plantillas del sitio

Aparecerá una tabla con todas las plantillas preinstaladas. La plantilla actual muestra una marca verde junto a la columna Predeterminado.

plantillas del sitio

Si quieres mostrar la vista previa de una plantilla, pasa el puntero del ratón sobre el nombre de la misma. Aparecerá una miniventana con una imagen en miniatura del aspecto de la plantilla.

Para seleccionar otra plantilla diferente:

  • Activa la casilla correspondiente a la plantilla deseada haciendo clic en el botón situado a la izquierda de su nombre. Por ejemplo, madeyourweb.
  • Haz clic en el botón de la parte superior Defecto.
  • Vete a la pestaña en la que se muestra el Frontend y recarga la página. Ahora el aspecto de la página ha cambiado.
  • Repite el procedimiento con la otra plantilla prediseñada: rhuk_solarflare_ii. Ahora el diseño de tu página vuelve a ser diferente.

Si lo deseas puedes aplicar la plantilla únicamente a determinadas páginas y no a todo el sitio. Para ello, cuando selecciones una plantilla no hagas clic en Defecto, sino en el botón Asignar. Por ejemplo, haz clic sobre la plantilla madeyourweb y, a continuación, en el botón Asignar. En la nueva ventana, selecciona la página o páginas en las que deseas aplicar esa plantilla, por ejemplo, mainmenu - noticias y deja la plantilla rhuk_solarflare_ii por defecto. Observa los cambios en el Frontend: haz clic en el menú noticias y verás que el diseño es otro. Para quitar la asignación repite el procedimiento y selecciona la entrada Ninguno.

NOTA. ¡Asegúrate de que la plantilla Ruhk_solarflare_ii es la activa por defecto para seguir el siguiente apartado de este artículo!


La versatilidad de Joomla: los módulos

Una de las características de Joomla que, precisamente es responsable de su versatilidad, personalización y potencia, son los llamados módulos. Hablaremos más adelante de ellos y por ahora, tan sólo debes conocer que Joomla tiene previamente instalados una enorme variedad de ellos: algunos probablemente ni siquiera utilizarás mientras que otros son indispensables para la estabilidad del sistema. Aunque sea muy simple, entenderás fácilmente la utilización de los módulos si piensas en ellos como cajones capaces de alojar los datos contenidos en Joomla. Por ejemplo, existe un módulo de encuestas que se encarga de colocar en alguna posición de la Web encuestas a los usuarios del sitio, un módulo para los menús, otro módulo para mostrar los artículos más visitados, o las últimos artículos publicados, etc.

Podrás ver los módulos instalados mediante el gestor de módulos, que lamentablemente no se localiza en el Panel de Control. Tendrás que acudir al menú Módulos - Módulos del sitio para visualizar la lista de módulos instalados:

módulos del sitio

Se abrirá una nueva página en la que se mostrará el listado de módulos instalados en el sitio Web.

Esta página nos ofrece mucha información, destacando:

  • En la primera columna se muestra el nombre del módulo y su información pertinente en la fila que le corresponde. Por ejemplo, enseguida podrás comprobar si el módulo se ha publicado (validado en verde) o no (marca roja).
  • La columna Publicado te muestra el estado del módulo: si está publicado y será visible, por tanto, en el sitio mostrará una marca verde, en caso contrario, será roja. Para desactivar o reactivar un módulo, es decir, publicarlo o no, sólo tendrás que hacer clic sobre el icono correspondiente. También puedes validar la casilla correspondiente al módulo elegido y, a continuación, hacer clic sobre los botones de la parte superior, Publicar o No publicar. Esta columna será muy importante cuando administres los módulos instalados en tu sistema pues si no están publicados no podrán ser visualizados en tu sitio Web. A veces, ocurrirá que cometerás errores como creer que algo va mal y simplemente, es que el módulo está despublicado.

módulos del sitio

Observa que la lista de módulos es muy larga y que, en tus tareas de administración, podrás instalar muchos más así que es muy probable que en este gestor de módulos existan varias páginas para mostrártelos. En algunos casos, tendrás que pasar página (al final de la pantalla) para ver los demás elementos de la lista. O bien ajustar el número de elementos para tener que pasar menos páginas (busca en la parte inferior Ver y cambia a un número inferior y superior para advertir los cambios en la lista).

A la cantidad de módulos se le añaden otras posibilidades como son las posiciones que dichos módulos ocupan en el sitio Web. Las plantillas de Joomla incluyen varias posiciones. Detrás de ellas se esconden las áreas en las que se colocan los contenidos. En la práctica son como contenedores para contenidos y menús y se pueden llamar user1, user2, top, right, left, banner, etc.

Observa la columna del gestor de módulos denominada Posición: por ejemplo la posición del menú principal es left - izquierda, y por tanto, en la Web el menú principal se mostrará a la izquierda de la pantalla).

Si te lías con el idioma inglés y además no entiendes bien algunos de estos términos debes saber que la posición de los módulos depende de la plantilla que estés utilizando y que puedes visualizar estas posiciones mediante la opción del menú Sitio - Vista previa - En línea con las posiciones.

vista previa en linea con las posiciones

Fíjate en la plantilla utilizada actualmente por Joomla (rhuk_solarflare_ii) dónde se encuentran las posiciones left, user1, user2 o top. Si miras la lista de módulos ahora verás que cada uno tiene “asignada” una posición. Pero esto no es inamovible, es perfectamente posible mostrar cada módulo en una posición distinta.

Realicemos un ejemplo para que compruebes los cambios que se producen en el sitio Web:

  • Desactiva o despublica el módulo Destacamos que se localiza en la posición top. Para ello haz clic sobre el icono verde: en décimas de segundos cambia a icono rojo de no publicado.
  • Vete a la pestaña en la que se encuentra el Frontend del sitio y recarga la página para visualizar el cambio. Observa que la posición top ha quedado libre y el navegador te lo indica con el mensaje Top Module Empty.
  • Ahora vas a colocar otro módulo preinstalado en este lugar. Para ello, vete a la pestaña del backend y en la lista de módulos haz clic sobre la entrada Popular (observa que su posición es User2).
  • En la nueva pantalla selecciona en Posición (haciendo clic sobre el triángulo invertido) la opción Top y aprovecha para cambiar su título a Los más leídos.
  • Guarda los cambios haciendo clic sobre el botón Guardar de la parte superior.
  • Recarga de nuevo la página del Frontend para comprobar que, en efecto, este módulo ocupa ahora la posición top.

Este sencillo ejemplo te muestra la extraordinaria habilidad de cambios que Joomla posee gracias a las combinaciones que podrás realizar con los módulos preinstalados o aquellos que desees instalar para aumentar sus funcionalidades.

Prueba a despublicar el módulo banner (que muestra un banner publicitario) para ganar espacio así en la publicación de los contenidos, por ejemplo.

Por cierto, otra de las opciones que podrás variar es el orden en el que se colocan cada uno de estos módulos en su posición. Observa la columna Ordenar y el número asignado a cada número, por ejemplo, de los módulos que se localizan en left. La numeración indica que en primer lugar aparecerá el menú Principal, le seguirá, por este orden, Menú del usuario (visible sólo para usuarios registrados), Recursos Joomla, el formulario de acceso o los botones de Sindicación. Podrás cambiar este orden “subiendo y bajando” cada módulo haciendo clic sobre las flecha azules hacia arriba o hacia abajo respectivamente. Prueba a poner en primer lugar el módulo Formulario de acceso, por ejemplo. Ordena los módulos presentes en tu sitio Web como te interesen que el visitante del sitio acceda a ellos.


A través de este artículo ya conoces de Joomla:

  • Que se administra vía Web y los cambios que realices serán automáticamente visualizados en tu sitio Web (la actualización de tu sitio Web será inmediata, por tanto).
  • Que el diseño de tu sitio Web depende de la plantilla instalada y de la posición de los módulos instalados.
  • Que necesitarás acceder al sistema como Administrador para realizar ciertos cambios en él.
  • Que Joomla es muy personalizable: podrás no sólo cambiar su plantilla predeterminada, sino asignarla a determinadas páginas del sitio y cambiar de posición los módulos y ordenarlos de manera diferente en la página.