Construyendo un menú multicolumna en Drupal 7 con Superfish

  • Posted on: 23 May 2014
  • By: santy

Crear un menú multicolumna es relativamente fácil si tenemos los módulos necesarios para ello. Un par de módulos y un poco de programación CSS es suficiente para armar nuestro menú.

Los módulos que necesitaremos para ellos son:

  • Superfish: Módulo potente y versatil que usa jQuery, requiere de una librería para su funcionamiento. Incorpora algunos estilos que nos pueden ser útiles. Se le puede sacar mucha chicha.
  • Special Menú Items: Módulo sencillo que nos ayuda a crear categoría en el menú, que no estén enlazadas especialmente. Basicamente permite añadir la etiqueta nolink a aquellos enlaces de menú que no queramos que se enlacen.

Después de instalar los módulos y crear las categorías y subcategoria de menú necesarias, vamos a Bloques o Context y añadimos el bloque Superfish a la sección de la web donde queramos que se muestre, le decimos la el tipo de menú, horizontal o vertical y elegimos el estilo, en este caso le decimos que ninguno. En la sección de multi-colum marcamos la casilla Enable multi-colum sub-menus.

Ya tenemos nuestro menú desarrollado ahora nos queda la maketación.

Drupal nos ha creado las siguientes classes:

  • sf-megamenu-wrapper
    • sf-item-1
      • sf-megamenu-colum
        • sf-item-1
        • sf-item-2
        • sf-item-3
        • sf-item-4
    • sf-item-2
      • sf-megamenu-colum
        • sf-item-1
        • sf-item-2
        • sf-item-3
        • sf-item-4
        • sf-item-5
        • sf-item-6

Con algo de paciencia y ayuda del Firebug le damos los estilos necesarios para que nos quede algo así:

Añadir nuevo comentario

Plain text

  • No se permiten etiquetas HTML.
  • Las direcciones de las páginas web y las de correo se convierten en enlaces automáticamente.
  • Saltos automáticos de líneas y de párrafos.
CAPTCHA
Esta pregunta es para comprobar si usted es un visitante humano y prevenir envíos de spam automatizado.