I have learned a lot from this site since I discovered it a couple weeks ago, and actually re-designed my band web page (in beta form right now at http://testingground.fropac.com/wordpress) by following along with your PSD to CSS screencasts and tweaking some things along the way. One thing that's really stumped me though is, how did you get css-tricks to work so that the "ARTICLES" tab is in the "on" state when you get here? I used the following code in header.php to get the other tabs to work in the "on" state:
<body id=\"<?php the_title();?>\">
but on the main page that code makes the ID whatever the title of the most recent article is. Any suggestions?
Like you've figured out, I use an ID on the body to "activate" the tabs. I don't use anything dynamic in those ID names, in the header.php file in my WordPress theme, my body ID is set to "blog" which makes that tag active on all articles pages. These other pages are not WordPress powered, so in those files I set the ID to something else.
Here's an update for anybody that reads this who ran into the problem I did and wants to keep all their pages in WordPress. I managed to get it to validate and work properly at the slight expense of my SEO-friendly permalinks. If you leave your WordPress permalink structure on "default," the following code will help differentiate the pages for your tabs to work properly:
ends up giving me the "home" body tag right, but shows the other tags as (for example) bio<body id="">.
I'd imagine you could expand on it and do something using if/else statements to use it with the SEO-optimized permalinks, but until I decide to not be lazy anymore and actually work on it, this is going to have to do.
but on the main page that code makes the ID whatever the title of the most recent article is. Any suggestions?
<?php if(!isset($_GET['page_id'])) { ?><body id=\"home\">
<?php } else { ?>
<body id=\"<?php the_title();?>\">
<?php } ?>
You'll note I used HORRIBLE php structure here, but for some reason trying it like this:
<?php if(!isset($_GET['page_id']) {echo '<body id=\"home\">';
} else {
echo '<body id=\"'.the_title().'\">';
}
?>
ends up giving me the "home" body tag right, but shows the other tags as (for example) bio<body id="">.
I'd imagine you could expand on it and do something using if/else statements to use it with the SEO-optimized permalinks, but until I decide to not be lazy anymore and actually work on it, this is going to have to do.