php - How to use images as nav buttons in Wordpress? -


here navbar in header.php

<!-- nav -->        <div id="nav">         <ul>             <li><a href="<?php bloginfo('url'); ?>"><img src="<?php bloginfo('stylesheet_directory'); ?>/images/navbar/home.png" alt="ad image" /></a></li>             <li><a href="<?php bloginfo('url'); ?>"><img src="<?php bloginfo('stylesheet_directory'); ?>/images/navbar/nav2.png" alt="ad image" /></a></li>             <li><a href="<?php bloginfo('url'); ?>"><img src="<?php bloginfo('stylesheet_directory'); ?>/images/navbar/nav3.png" alt="ad image" /></a></li>             <li><a href="<?php bloginfo('url'); ?>"><img src="<?php bloginfo('stylesheet_directory'); ?>/images/navbar/nav4.png" alt="ad image" /></a></li>             <li><a href="<?php bloginfo('url'); ?>"><img src="<?php bloginfo('stylesheet_directory'); ?>/images/navbar/nav5.png" alt="ad image" /></a></li>             <li><a href="<?php bloginfo('url'); ?>"><img src="<?php bloginfo('stylesheet_directory'); ?>/images/navbar/nav6.png" alt="ad image" /></a></li>             <?php wp_list_categories('title_li='); ?>         </ul>     </div> <!-- end nav --> 

how each button go there respected pages? if add in category through dashboard adds in text based link. want images represent different categories, thoughts?

i think have 2 options:

  • manipulate wp_list_categories() function display images

  • manipulate text links via css hide text, , show background image instead (color: transparent; display: block; height: xyz; width: xyz; background-image: url(...)) depends on how list rendered, , whether there characteristics identify each list item.

the cleanest way rewriting wp_list_categories() or using plugin provides replacement. see wordpress forum entry: how customize wp_list_categories()?


Comments

Popular posts from this blog

c++ - Convert big endian to little endian when reading from a binary file -

C#: Application without a window or taskbar item (background app) that can still use Console.WriteLine() -

unicode - Are email addresses allowed to contain non-alphanumeric characters? -