Reemplazar elementos del menú con imágenes


8

Estoy buscando una manera de mostrar los elementos de un menú como imágenes (con desplazamiento) en lugar de los enlaces de texto habituales. Encontré los íconos de menú del módulo , pero como su nombre lo indica, está diseñado para colocar el ícono al lado del enlace. ¿Alguien tiene una técnica para hacer esto? Tal vez tenga que crear algún tipo de bloque o panel personalizado, pero pensé que tal vez había una manera más fácil.

Respuestas:


7

Puede usar el módulo de iconos de menú para implementar la funcionalidad que está buscando. Lo he hecho varias veces.

Simplemente necesita personalizar el archivo menu_icons_css_item.tpl.php para que la imagen se muestre utilizando la técnica de reemplazo de imágenes CSS en lugar de colocar la imagen como un fondo similar a un icono. Para la funcionalidad de transferencia, cada imagen que cargue con el módulo de icono de imagen deberá incluir las versiones estática y de transferencia de la imagen del menú.

Aquí hay contenido de muestra de un archivo menu_icon_css_item.tpl.php que he usado antes. Esto es para Drupal 6, por lo que es posible que deba actualizar parte de la sintaxis si está utilizando Drupal 7.

<?php
$base_url = $_SERVER['DOCUMENT_ROOT'];
$image_info = getimagesize($base_url.$path);
$width = $image_info[0];
$height = $image_info[1]/2;
?>

ul.links li.menu-<?php print $mlid ?> a {
  background-image: url(<?php print $path ?>);
  background-repeat: no-repeat;
  background-position: 0 0;
  height:<?php print $height?>px;
  text-align: left;
  text-indent: -9999px;
  width: <?php print $width?>px;
}

ul.links li.menu-<?php print $mlid ?> a:hover {
  background-position: 0 <?php print $height?>px;
}

Después de crear un archivo de cliente menu_icons_css_item.tpl.php en su tema, deberá eliminar el archivo CSS que el módulo de iconos de menú generó anteriormente, para que genere un nuevo archivo utilizando esta plantilla. Debe estar en la carpeta de sitios / predeterminado / archivos.

Por supuesto, si no necesita permitir que los administradores del sitio actualicen las imágenes de los elementos del menú a través de la interfaz de usuario de Drupal, puede implementar la técnica de reemplazo de imágenes CSS dentro de su tema, sin necesidad de un módulo auxiliar como los iconos de menú.


Gracias, funciona muy bien (PS Estoy usando la fusión de arranque como mi plantilla base)
user379468

¡Me encanta ver gente usando Fusion! : D
sheena_d
Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.