Navegación. Capítulo 11. Photo: CC BY 2.0. Joomla! Beginner s Guide

Transcripción

1 Joomla! Beginner s Guide Capítulo 11 Navegación Photo: CC BY 2.0 Todo sitio necesita una navegación fácil de entender, o de otra forma no será posible para un usuario encontrar lo que que está buscando. Esto puede sonar simple, pero lo cierto es que no es fácil de hacer. En un mundo perfecto debería ser posible acceder a cualquier página de un sitio con dos o tres clics. Otro hecho es que habitualmente, si no siempre, tus visitantes llegarán desde un motor de búsqueda o desde el sitio de una red social y aterrizarán en cualquier sitio en tu web menos en la página principal. Esta es una buena razón para plantearse tener un botón "Inicio" en todas las páginas de tu sitio! Un sitio web a menudo tiene una navegación primaria y otra secundaria. La navegación primaria se encuentra habitualmente en la parte superior, a la izquierda del todo o a la derecha del todo en tu web. La navegación secundaria suele estar abajo del todo o arriba del todo, pero casi siempre con un tamaño un poco más pequeño que el de la primaria. Contiene enlaces como "Contacto", "Sobre nosotros" o "Aviso legal". La idea tras esto es tener esos enlaces en el sitio, pero no en una posición importante. Como regla general, no pongas más de entre 4 y 8 enlaces en un nivel de navegación. 4/22/12 Página 103

2 RUTA DE NAVEGACIÓN (BREADCRUMBS) Una 'ruta de navegación' es una herramienta para ayudar al visitante del sitio a desplazarse por el mismo. En inglés se usa el término 'breadcrums trail', que literalmente significa 'rastro de migas de pan', en referencia al cuento popular de los Hermanos Grimm, Hansel y Gretel 38, en el que Hansel utiliza un rastro de migas de pan para marcar el camino de vuelta a casa. Normalmente la barra de navegación está situada horizontalmente en la parte superior de la página web. Se usan dos estructuras: mostrar los enlaces de vuelta a cada página del sitio por la que ha pasado el usuario hasta llegar a la actual mostrar las páginas 'padre' de la actual Las rutas de navegación son una manera de evitar que los usuarios se sientan perdidos en tu sitio. Idealmente, los visitantes deberían saber siempre dónde están exactamente dentro del sitio, y cómo volver atrás. Joomla! proporciona un módulo de 'navegación' para esta tarea, y la mayoría de plantillas tienen una posición 'breadcrumb' reservada para él (Figura 1). Figura 1: Breadcrumbs MENÚS DE JOOMLA! Los niveles de navegación en Joomla son creados por los denominados menús. Puedes crear tantos menús como necesites en tu sitio web. Cada menú puede contener cualquier número de elementos anidados, y puedes incluso filtrar por nivel. Cada elemento de menú es asignado a un componente o a una URL externa. Los módulos y los estilos de las plantillas pueden ser asignado a los elementos de menú. En los datos de ejemplo se muestran varios menús que ya han sido creados /22/12 Página 104

3 Echemos un vistazo a dos ejemplos de navegación primaria con páginas estáticas y categorías dinámicas. PRIMER EJEMPLO: CATÁLOGO ESTÁTICO O ESTRUCTURA DE LIBRO A veces necesitas una estructura de navegación para un libro, catálogo o guía. Puedes encontrar esta configuración en los datos de ejemplo en el menú Acerca de Joomla!. Digamos que estamos escribiendo un libro corto consistente en tres capítulos. La navegación debería estar presente en todas las páginas, y verse como en la Figura 2. Figura 2: Estructura estática de un libro Preparación Crea la estructura del libro con unos cuantos capítulos El libro de Joomla Introducción Contenido Cómo usar A Cómo usar B Plantillas Antes de crear los elementos de menú, debes crear artículos individuales (páginas). Ve a Contenido Gestor de artículos Crear (Figura 3). Puedes asignar la categoría uncategorized a esos artículos, o bien puedes crear una nueva categoría libro antes, e ir asignándosela a los capítulos. 4/22/12 Página 105

4 Figura 3: Seis 'capítulos de libro' Paso 1: Creando el menú Puedes usar un menú existente para tus enlaces primarios o puedes crear uno nuevo desde Menús Gestor de Menús Nuevo y rellenando el formulario de creación de menús (Figura 4). Figura 4: Añadir un nuevo menú Paso 2: Crear los elementos del menú Ve a Menús Enlaces primarios y añade los seis artículos como enlaces. Elige Mostrar un solo artículo como Tipo de elemento de menú. Selecciona el artículo (en la parte derecha) e introduce un Título de menú (Figura 5). Si has olvidado cómo hacerlo, echa un vistazo de nuevo al capítulo Cómo crear una página 'Sobre Nosotros'. 4/22/12 Página 106

5 Figura 5: Elementos de menú primarios Paso 3: Crear y asignar el módulo Este paso puede ser un poco engorroso. En este momento tienes los artículos, el menú y los elementos de menú, pero necesitarás también un módulo para colocarlo en tu sitio. Sigamos adelante y creemos uno. Ve a Extensiones Módulos Nuevo módulo, elige un módulo tipo menú y rellena el formulario. Dentro de las Opciones básicas, en el campo Seleccionar menú elegiremos el menú que creamos en el paso 1, enlaces primarios y marcaremos Sí en el campo Mostrar los elementos del menú (Figura 6). Figura 6: Módulo de enlaces primarios El último paso es seleccionar la posición de la plantilla. Haz clic en el botón Seleccionar Posición, filtra por la plantilla Beez_20 y elige la posición position-4. Guarda todo y ya estás listo. 4/22/12 Página 107

6 Figura 7: Seleccionar la posición de la plantilla SEGUNDO EJEMPLO: ENLAZAR A CATEGORÍAS (REVISTA DE NOTICIAS) Es posible enlazar a unas cuantas páginas como en el primer ejemplo pero, qué hacer si tienes miles de artículos? La respuesta es fácil en Joomla! 2.5: construir una estructura con categorías, asignar los artículos y enlazarla a un diseño de categoría. Preparativos Necesitaremos unas cuantas categorías con artículos: Categorías: Noticias Mundo África Europa Tecnología Internet Coches Créalas o usa alguna categoría existente (Más información: Estructurar el contenido en categorías). Paso 1: El menú Ahora es cosa tuya el cómo continuar. La manera más fácil es usar el menú Enlaces Primarios. Pero si quieres, puedes crear un nuevo menú llamado Noticias, como he hecho yo. Paso 2: Los elementos de menú Cuando trates con categorías debes pensar sobre qué debería mostrarse una vez que hayas hecho clic en el enlace. El resultado que esperamos obtener en nuestro caso es Categoría Noticias = todas las noticias deberían aparecer 4/22/12 Página 108

7 Categoría Noticias Mundo = queremos sólo las noticias del mundo y así (Figura 8). Figura 8: Elementos de menú en el menú Noticias Para conseguir el comportamiento esperado, crea un elemento de menú del tipo Mostrar una categoría en formato blog. En las Opciones obligatorias, elige la categoría recién creada Noticias. En las Opciones del formato tipo blog o destacados, elige Incluir subcategorías - Todas y Cantidad de artículos de introducción - 0. Continúa creando los elementos de menú anidados para cada categoría adicional y ya estás listo (Figura 9). 4/22/12 Página 109

8 Figura 9: Opciones de Categoría Ahora puedes manejar miles de artículos. Tu estructura de navegación está preparada para ello, y tus visitantes entenderán el sistema inmediatamente (Figura 10). Figura 10: Artículos en una estructura de categorías Algunos ajustes Como has visto, hay prácticamente infinitas posibilidades a la hora de configurar las opciones. Son posibles muchas cosas, y normalmente siempre habrá una forma de conseguir tus objetivos. En lo que se refiere al diseño de la estructura de navegación, es posible filtrar el nivel de los elementos de menú mostrados en el propio módulo. Es posible, por ejemplo, poner el primer nivel de nuestro menú Noticias en la posición superior, y los niveles segundo y tercero en las barras laterales izquierda o derecha. todo el menú en la parte superior, y usar menús desplegables (dependiendo de las capacidades de la plantilla) Si juegas un poco con las distintas opciones, descubrirás una solución prácticamente para cada caso. El sistema de navegación de Joomla! puede ser un poco complejo por un lado, pero por el otro es un sistema muy potente. 4/22/12 Página 110