I just realized that they added some sweet features to the wp_list_pages() funtion in WordPress 2.7. These include the ability to add html before and after menu items.
I was struggling earlier today, trying to squeeze graphic dividers between dynamically-created between menu items. After trying all sorts of CSS tricks, I discovered this simple workaround included in WordPress since 2.7.
The basic code to add an image after each menu item looks like this:
<?php wp_list_pages(‘link_after=<img src=”http://mydomain.com/myImage.gif”‘); ?>
ALSO, as a bonus, I also discovered the brand new (since 2.7) function, wp_page_menu(), which is similar to the aforementioned wp_list_pages function, except that this one is specially-designed to allow us to add the “home” page to the menu. My guess is that the new wp_page_menu() function will eventually replace wp_list_pages().
Enjoy!
3 Comments
More posts from themightymo.com
The Ultimate Guide to WordPress Support: Why it’s Essential for Your Website’s Success
Whether you’re situated in Minneapolis, St. Paul, Illinois, New York, or any other corner of the globe, ensuring reliable WordPress Support is paramount for the continued success of your website. In this comprehensive guide, we will delve into the crucial role that WordPress support plays in your website’s journey to success.
How to optimize your Google Crawl Budget using SEM Rush Log File Analyzer and Rank Math SEO
Today I ran the SEM Rush Log File Analyzer tool, and it showed some interesting things that are a complete waste of our Google Crawl Budget. Specifically, I learned that Google is wasting some of our crawl budget on the /wp-includes/ directory, certain plugin directories, and cache directories. I also noticed random files being crawled…
Where is the Google Analytics Measurement ID?
In the vast, evolving world of web development and analytics, keeping up with terminologies and tools can sometimes feel like trying to chase a mischievous cat in a maze. You think you’ve got a grip, only for it to slip right through your fingers! Enter the mysterious “Measurement ID” from Google Analytics 4 (GA4), a…
Good tips Toby. Thanks.
This works great for putting an item next to all of the menu items but is there a way to use the link_after command for only one of the menu items? For example, if I wanted to have just one menu item (page id 20) have an icon to the right of the text?
Since wp_list_pages() gives each list item its own class, you could run an “if…then” statement in php to add a “display:none;” CSS class to the appropriate items. Or you could just use CSS to manually hide each image. Something like:
.page_item page-item-7 img{
display:none;
}
I haven’t tried this, but it seems like it should work.