Artisteer and Menu Bars

When I was building this site, I decided to build it upon WordPress.  For those who have used it before know that it’s a pretty damn good piece of blogging software.  It’s really easy to use, and extremely extensible.  Themes are also a big part of WordPress, and there’s tons of different ones out there that you can use.  I did look through many different ones, but none of them really stuck out to me.  I wanted something that was different…something that was me.

I’m not much of a designer though.  So, I did a bit of research, and came across a nifty little piece of software called Artisteer. Artisteer is basically a GUI-based theme generator.  It’s great because I didn’t have to much around with a ton of PHP and CSS code to get the theme the way I wanted.  I recommend anyone try it out if you have a WordPress site.

Anyways, the main point of this post is not only to tell you about how good Artisteer is, but also how picky it can be.  In the tool itself, Artisteer shows a Categories and Archives dropdown menu, as seen on my site here.  But, the problem is when you export the Artisteer theme, it doesn’t come with those menus, and it wasn’t very clear on how to add them.  After spending a few hours fiddling with WordPress functions and PHP code, I ended up adding this code to my functions.php file for my theme, inside the art_menu_items() function:

  1.  
  2. /* Already existing code */
  3.     if (true === $showHomeMenuItem || ‘page’ == get_option(‘show_on_front’))
  4.         echo ‘<li><a’ . ($isHomeSelected ? ‘ class="active"’ : ) . ‘ href="’ . get_option(‘home’) . ‘"><span><span>’
  5.                 . $homeMenuItemCaption . ‘</span></span></a></li>’;
  6.  
  7. /* Code for categories */
  8.         wp_list_categories(‘title_li=<a href="#" title="Categories"><span><span>Categories</span></span></a>’);
  9.  
  10. /* Code for archives */ 
  11.         echo ‘<li><a href ="#" title="Archives"><span><span>Archives</span></span></a><ul>’;
  12.         wp_get_archives("type=monthly");
  13.         echo ‘</ul></li>’;
  14.        
  15. /* Already exsisting code */
  16.         add_action(‘get_pages’, ‘art_header_page_list_filter’);
  17.         add_action(‘wp_list_pages’, ‘art_list_pages_filter’);        
  18.         wp_list_pages(‘title_li=’);
  19.         remove_action(‘wp_list_pages’, ‘art_list_pages_filter’);
  20.         remove_action(‘get_pages’, ‘art_header_page_list_filter’);
  21.  

By adding the title_li parameter with a link tag for Categories in it (even in this case it’s blank) for the wp_list_categories() function, it allows for the CSS to pick it up correctly, like the rest of the pages that are used in the header. For the archives section, a bit more work was needed. You need to add a new list item tag for the archives manually, start a new list inside that, and then just call wp_get_archives(). Then, finish off with the closing tags for the inner list and the list item itself.

Anyways, I hope that’s of help to anyone looking at adding categories and/or archive menu items to their navigation bars.

Until next time…