Índice

La barra de menús

1. Diseño

El elemento HTML5 <nav> contiene un módulo de tipo Menú en la posición llamada position-1

La caja <div> propone una composición minimalista: un borde superior e inferior.

En el archivo template.css, introduzca esta regla:

nav {  
  border-top: 1px solid black;  
  border-bottom: 1px solid black;  
}

Para los enlaces <a>, contenidos en ítems <li> de lista <ul>, optaremos por una vista en fila, unos al lado de otros:

En el archivo template.css, introduzca esta regla:

nav ul {  
  margin: 0;  
  padding: 0;  
}  
nav ul li {  
  display: inline-block;  
  margin-right: 20px;  
}

2. Insertar la barra de menús

La barra de menús puede colocarse en la posición position-1 o en otra. El usuario también puede situar otro módulo en ella. Deberemos comprobar, por tanto, si hay algún módulo situado en la posición position-1. De ser así, lo mostraremos; en caso contrario, no mostraremos nada.

En el archivo index.php, a la altura del elemento HTML5 <nav>, introduzca este código:

<?php if ($this->countModules(’position-1’)): ?>  
  <nav>  
      <jdoc:include type="modules" name="position-1"  
        style="none" />  
  </nav>   ...