Work with index.php to display a tab for created categories

jhames, in this thread there is the correct code to display a category on your home page, in case you are still trying to figure it out!

Holy Dhammapada, buddha trance, it worked! Now I can view only the News entries on the main page.

…Now I just need WP to display the “News” tab with the class “current_category”.

jhames,

glad it worked!

Regarding the tabs, I have been working on something that may be just like your case and was able to find a solution for this last night, by keeping the entire original “current_page” code, creating a page called like the category, and then using a template.

Let me know if you want to try it the way I did, and I will tell you the steps.

I found a link via Google on a WordPress Navigation Bar and I am trying to adjust its use on the page.

<?php //highlight 'Blog' if not Page
if (is_page()) {
$highlight = "page_item";
} else {
$highlight = "page_item current_page_item";
}
?>
<div>
<ul class="tabs">
<li class="<?php echo $highlight; ?>"><a href="<?php echo get_settings('home'); ?>">Latest News</a></li>
<?php wp_list_categories('title_li='); ?>
</ul>
</div>

Can your solution be done within the default pages provided by WP? I’m only asking because I have limited server access.

I found a link via Google on a WordPress Navigation Bar and I am trying to adjust its use on the page.

<?php
if (is_page()) {
$highlight = "page_item";
} else {
$highlight = "page_item current_page_item";
}
?>
<div>
<ul class="tabs">
<li class="<?php echo $highlight; ?>"><a href="<?php echo get_settings('home'); ?>">Latest News</a></li>
<?php wp_list_categories('title_li='); ?>
</ul>
</div>

Can your solution be done within the default pages provided by WP? I’m only asking because I have limited server access.

I found a link via Google on a WordPress Navigation Bar and I am trying to adjust its use on the page.

<?php
if (is_page()) {
$highlight = "page_item";
} else {
$highlight = "page_item current_page_item";
}
?>
<div>
<ul class="tabs">
<li class="<?php echo $highlight; ?>"><a href="<?php echo get_settings('home'); ?>">Latest News</a></li>
<?php wp_list_categories('title_li='); ?>
</ul>
</div>

Can your solution be done within the default pages provided by WP? I’m only asking because I have limited server access.

Sorry for the multiple replies, WP didn’t show my first reply as posted.

Try that code first to see if it works for you, it may be simpler.

My solution involves creating template pages. That means uploading 3 files to the server, for your 3 category tabs, into your theme folder. It fairly easy, though.

Then you have to adjust style.css to highlight the current tab. I am using that on my site, so I can give you my code, and you can adjust the styling to fit yours.

Mother Mary Magdalene, I got it to work!

I now have the active tab using the “on” state with the other two tabs using the “off” state, AND only posts associated with “news” are displaying on the homepage.

Now one last trick: when the user clicks on “events”

• how to hide the posts related to “news”
• how to highlight “events” with the “on” state tab

WP is really cool, I only wish so much of my questions weren’t dependent on PHP. :\ But thank you so much for all of your assistance, buddha trance! I couldn’t have made it this far without you. ??

Reading your last response a second time, I think your solution is far, far simpler.

I better get on that server access asap.

jhames,

I just looked at your site again. Well, congratulations for the first tab!
Yes, the templates may be the way to go, because you are showing “Archives” for the other tabs.

That way, you will have 3 pages, each showing only that category. With 3 active tabs, each on and off.

Let me tell you what you need to do with my method, so that others may benefit from this thread, in case they need a similar thing. Will post in a few minutes, so I can look at my files again.

1 – CREATE THE TEMPLATES

Start your new template page (which you call events.php) with

<?php /*
	Template Name: Events
*/ ?>

then, right underneath, copy and paste the entire content of index.php of your theme.
Do the edit below:

Right in between <?php if(have_posts()) : ?> and <?php while(have_posts()) : the_post(); ?> you add the query of the category you want to display (change the number to your own category ID, of course), like this:

<?php if(have_posts()) : ?>
		<?php
   if (is_page()) {
      query_posts("cat=29");
   }
?>
<?php while(have_posts()) : the_post(); ?>

This is the same thing you should have in your “Latest News”, because it’s the index page with the query for that category. Right?

Repeat the steps and do the same for the other “Press Releases” template (press.php), with the appropriate category ID in the query.

Upload the files into your theme folder, just where you have sidebar.php, header. php, index.php, etc.

2 – CREATE THE PAGES IN WORDPRESS

Go to your Admin –> Write –> Page, and create two new pages (this is the name that will appear in the tabs), and call one “Events” and the other one “Press Releases”.

Don’t put any text in there, leave blank, BUT from the “Page template” drop down menu, pick the right template you have created for each. Save and publish.

3 – THE MENU IN THE HEADER

In header.php of your theme, use the call to the pages for your menu (I have changed “Home” with “Latest News” for you, which is the call to the index.php page you already have with the news category query)

<ul class="menu">
<li class="<?php if ( is_home() or is_archive() or is_single() or is_paged() or is_search() or (function_exists('is_tag') and is_tag()) )
	{ ?>current_page_item<?php } else { ?>page_item<?php } ?>"><a title="<?php bloginfo('name'); ?>" href="<?php bloginfo('url'); ?>">Latest News</a></li>

	<?php wp_list_pages('depth=1&title_li=&exclude='); ?>
</ul>

4 – THE STYLE.CSS

This is the call to the classes mentioned in the header. Adjust according to the look, colors, etc. you want.

/*-----main-menu*/
	ul.menu{position:absolute; right:25px; padding:5px 10px 0;}
	ul.menu li{float:left; margin:0 0 0 5px; background:#777; font:bold 11px/1 'trebuchet ms', arial, sans-serif;}
	ul.menu li a{display:block; color:#fff; padding:5px 10px;}
	ul.menu li a:hover{text-decoration:none; background:#888;}
	ul.menu li.current_page_item a, ul.menu li.current_page_item a:hover{color:#444; background:#ccc;}

ET VOILA’!!!! I don’t think I forgot any steps… Let me know if this worked for you!

I just got server access this afternoon. I’ll try your solution and let you know asap the results.

Oh dear. I had unexpected results.

WordPress isn’t including <div> tags I wrote, but at the same time it’s inserting code I don’t want. I’m sorting through my events.php page right now trying to uncover why <div> tags didn’t get published.

I also have the main menu of tabs showing “Latest News” as current category, even though I’m on the events.php page.

I really enjoy the ease of WordPress from the publishing end but I’m concerned about the amount of PHP that a person must know in order to work with the system.