Substituindo itens de menu por imagens

Estou procurando uma maneira de exibir itens de menu como imagens (com rolagem) em vez dos links de texto usuais. Encontrei o módulo Ícones do menu , mas como o nome indica, ele foi projetado para colocar o ícone ao lado do link. Alguém tem uma técnica para fazer isso? Talvez eu precise criar algum tipo de bloco ou painel personalizado, mas pensei que talvez houvesse uma maneira mais fácil.

Você pode usar o módulo Ícones do menu para implementar a funcionalidade que procura - eu fiz isso várias vezes.

Você só precisa personalizar o arquivo menu_icons_css_item.tpl.php para que a imagem seja exibida usando a técnica de substituição de imagem CSS , em vez de posicionar a imagem como um plano de fundo semelhante a um ícone. Para a funcionalidade de rollover, cada imagem que você enviar com o módulo de ícone de imagem precisará incluir as versões estática e de rollover da imagem do menu.

Aqui está um exemplo de conteúdo de um arquivo menu_icon_css_item.tpl.php que eu usei antes. Isso é para o Drupal 6, portanto, algumas das sintaxes precisam ser atualizadas se você estiver usando o 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;
}

Depois de criar um arquivo menu_icons_css_item.tpl.php do cliente em seu tema, será necessário excluir o arquivo CSS que o módulo Ícones do menu gerou anteriormente, para que ele gere um novo arquivo usando este modelo. Ele deve estar na pasta sites / default / files.

Obviamente, se você não precisa permitir que os administradores do site atualizem as imagens dos itens de menu por meio da interface do usuário do Drupal, basta implementar a técnica de substituição de imagem CSS no seu tema, sem precisar de um módulo auxiliar, como os Ícones de menu.