La barra lateral es una de las mejores cosas del sistema gestor de contenido WordPress. Te permite añadir widgets que pueden ayudar a mejorar la funcionalidad y usabilidad de tu sitio web, además de darte la oportunidad de hacer que las características de tu sitio web sean únicas. Añadir widgets a la barra lateral es una tarea simple y algo de lo que ya hemos hablando en el pasado, así que hoy vamos a ver maneras más avanzadas de personalizar la barra lateral añadiendo navegación, metadatos, enlaces anidados e imágenes.
Añadir navegación
La navegación es una parte importante de WordPress – y de cualquier otro sitio web en realidad – y ayuda a los usuarios a orientarse por el sitio con complicaciones mínimas. Hay tres opciones de navegación en WordPress: páginas, archivos y categorías; puedes añadir una o las tres a tu sitio web editando el archivo sidebar.php de tu tema.
Para hacerlo (después de iniciar sesión en tu panel de control) ve a Apariencia > Editor. En el editor, desplázate hacia abajo hasta que veas la opción Barra lateral.
Abre el archivo sidebar.php y, bajo la siguiente línea de código:
<div id= "secondary" class= "widget area" role= "complimentary">
Introduce el código apropiado para la navegación que hayas elegido:
Páginas: <?php wp_list_pages('title_li=<h2>Pages</h2>'); ?>
Archivos: <?php _e('Archives:'); ?> <ul> <?php wp_get_archives('type=monthly'); ?> </ul>
Categorías: <?php _e('Categories:'); ?> <ul> <?php wp_list_cats(); ?> </ul>
Haz clic en Actualizar archivo para confirmar el cambio.
Añadir metadatos
La barra lateral, aunque suele usarse con fines de navegación, también puede ser usada para introducir metadatos, como por ejemplo un párrafo corto sobre el sitio web. Para hacerlo, sigue simplemente las instrucciones anteriores para acceder al archivo sidebar.php y, bajo la siguiente línea de código:
<div id= "secondary" class= "widget area" role= "complimentary">
Introduce lo siguiente:
<p class="aboutsite">Esta es mi página web. Espero que te guste lo que ves y encontrar el contenido útil.</p>
Obviamente te interesará cambiar el texto por algo apropiado. Haz clic en Actualizar archivo para guardar los cambios.
Añadir enlaces anidados
En el tema por defecto de WordPress y en algunos temas de teceros, las barras laterales incluyen enlaces anidados para presentar la información, los cuales tienen el siguiente aspecto:
- Vehículos
- Coches
- Motos
Puedes usar el archivo sidebar.php para añadir tus propios enlaces anidados. Una vez más, bajo:
<div id= "secondary" class= "widget area" role= "complimentary">
Introduce el siguiente código:
<ul style="list-style-type: disc;">
<li>Vehículos
<ul style="margin-left: .5em;">
<li>Coches</li>
<li>Motos</li>
</ul></li></ul>
Introduce un tema para el enlace anidado que se adapte a tu sitio web y haz clic en Actualizar archivo.
Añadir enlaces de imágenes
Para terminar, echemos un vistazo a cómo añadir enlaces de imágenes a la barra lateral, de manera que tu sitio web muestre una imagen, quizás algo como el logotipo de tu empresa.
Ya conoces el proceso para acceder al archivo sidebar.php, así que nos lo saltaremos. Simplemente tienes que introducir el siguiente código en el lugar adecuado:
<a href="http://xml.com"
title="Mi registro de página web">
<img src="http://misitioweb.com/logositioweb.jpg"
alt="Valid XHTML 1.0!" />
</a>
<br />
El «título» es el nombre de la imagen guardada y la etiqueta <img> es la URL de la imagen en tu sitio web.
Haz clic en Actualizar archivo para confirmar los cambios y ver la imagen en tu barra lateral.