How to use images as nav buttons in Wordpress?
Here is my navbar in header.php
<!-- NAV -->
<div id="nav">
<ul>
<li><a href="<?php bloginfo('url'); ?>"><img src="<?php bloginfo('stylesheet_directo开发者_Go百科ry'); ?>/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 do I get each button to go to there respected pages? If I add in a category through the dashboard it adds in a text based link. I just want the images to represent the different categories, any thoughts?
I think you have two options:
manipulate the wp_list_categories() function to display images
manipulate the text links via CSS to hide the text, and show a background image instead (
color: transparent; display: block; height: xyz; width: xyz; background-image: url(...)
) that depends strongly on how the list is rendered, and whether there are any characteristics to identify each list item.
The cleanest way would certainly be rewriting wp_list_categories() or using a plugin that provides a replacement. See this Wordpress forum entry: How to customize wp_list_categories()?
Each hard link needs to go somewhere:
<a href="<?php bloginfo('url'); ?>/categoryname/">
精彩评论