One of the easiest visual clues that you can offer your users is that of active and inactive tabs. This lets them know exactly where they are on your site at any moment. In this recipe, you'll learn the markup and styles you need to bring an easy tabbed interface to life.
You need to have a basic theme constructed, and need to have separated your main navigation items into their own pages in the WordPress back-end.
For this recipe, we're going to concern ourselves with a simple, one-column site with horizontal, tabbed navigation. While this technique can be applied to a variety of situations, the horizontal tabs are definitely the easiest. Your index.php
file should look something like the following:
<?php get_header(); ?> <div id="content"> <?php if( have_posts() ) { while( have_posts() ) { the_post(); ?> <div <?php post_class('post-container'); ?>> <h2 <?php post_class('post-title...