如何在WordPress中使用圖像作爲導航按鈕？

Question

這是我在導航欄的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 --> 

如何讓每個按鈕去那裏推崇網頁？如果我通過儀表板添加一個類別，它會添加一個基於文本的鏈接。我只想讓圖像代表不同的類別，任何想法？

Answer 1

我認爲你有兩個選擇：

• 操縱wp_list_categories（）函數來顯示圖像

• 操縱通過CSS文本鏈接隱藏文本，並顯示一個背景圖像，而不是（ color: transparent; display: block; height: xyz; width: xyz; background-image: url(...)），這強烈依賴於如何呈現列表以及是否有任何特徵來標識每個列表項。

最清潔的方法肯定是重寫wp_list_categories（）或使用提供替換的插件。看到這個WordPress的論壇條目：How to customize wp_list_categories()?

Answer 2

每個硬鏈接需要去的地方：

<a href="<?php bloginfo('url'); ?>/categoryname/">