It’s often very useful to have alternating classes in for styling purposes. Let’s say you want every other row to be a darker shading, this is very common and I’ll show you how to implement this in WordPress using a simple bit of code.

For my example here I will show you how to create alternating classes for use with the WordPress loop. This way, when the loop pulls your posts from the db every post container will have a separate class name up to as many as we define in our array. This method of alternating classes in WordPress will work for wherever you have a loop. Therefore, your comments, categories, tags, etc. can all be styled up using this method. Pretty cool huh? Let’s see how this is done.

Read the rest of this article »

So I recently started using a Mac at work and with the Adobe Creative Suite 5 just released I was pretty excited. The new additions to CS5 are great and I can see that working with WordPress will be a lot more streamlined. Anyways, I ran into a frustrating issue that a lot of other Mac/Dreamweaver CS5 users are encountering where launching the program results in a disabled dreamweaver.

Read the rest of this article »

Google’s new Font API, Cufon, @font-face, sIFR, FLIR…?! It’s 2010 and the Internet has long since evolved to become an integral part of modern society. As web designers, our web fonts used to be limited to a small number of ‘safe’ font-families. Today there are a number of options that allow web developers to break free from the confines of the limited ‘web-safe’ font spectrum and express themselves, and their websites, more individually with unique fonts. Let’s examine how the web’s top font solutions work and how they are implemented.

Read the rest of this article »

WordPress makes it very easy to dynamically create menus from pages and categories with the use of the function wp_list_pages() and wp_list_cats()... but what if you want to have separators in your menus? Here's a bit of code that will do just that:

wp_list_pages Separators

$args = array(
  'sort_column' => 'menu_order',
  'title_li' => '',
  'depth' => '1',
  'echo' => 0
);
$separator = ' | ';
$pattern = '/(<\\/a>).*?(<\\/li>).*?(<li)/is';
$replace = '</a>' . $separator . '</li><li';
$subnav = preg_replace($pattern,$replace,wp_list_pages($args));
echo $subnav;

Please note: I got this code from Rares Comes (very nice lavalamp menu there)

I'm building a new site and the navigation on it requires me to use a different bit of code for parent and child pages. I thought I'd share the code for those out there building a similar navigation. Here's a handy bit of code that you can use to display all subpages on a subpage. For instance, you have your pages setup like so:

Page: Fruit
subpage: Banana
subpage: Apply
subpage: Orange

On Parent Page

If you were wanting to show a navigation menu of all subpages in the Fruit category you could use the following bit of code:

<?php
  $children = wp_list_pages('title_li=&child_of='.$post->ID.'&echo=0');
  if ($children) { ?>
  <ul id="mainNav">
	<div id="locationsNavHead">choose a product</div>
  <?php echo $children; ?>
  </ul>
<?php } ?>

On Subpages

For child, or subpages, we could use the following bit of code:

<div id="sidebar">
<?php
//list subpages even if on a subpage
  if($post->post_parent)
  $children = wp_list_pages("title_li=&child_of=".$post->post_parent."&echo=0");
  else
  $children = wp_list_pages("title_li=&child_of=".$post->ID."&echo=0");
  if ($children) { ?>
  <ul id="mainNav">
  <div id="locationsNavHead">choose a product</div>
  <?php echo $children; ?>
  </ul>
<?php } ?>
</div>

If you are confused at what this all means please comment below and check out wp_list_pages() over at the WordPress Codex